父组件向子组件传递大量数据的问题，是通过子组件的自定义属性来传递的吗？
来源：6-9 销售趋势图表和列表开发
慕慕1545788
2020-08-12
我现在需要把父组件里js函数中的一个类似json格式的字符串数据传给子组件使用，不知道怎么写代码比较好。我现在只是做了个试验，在子组件模块中定义了一个属性：
这个属性的名字叫sensordatasets,同时在子组件的html中使用了这个属性：
然后在父组件中所调用的子组件的html中对这个属性赋值：
可以发现子组件上可以显示出这个父组件中赋的值：
这个试验算是成功了，但是满足不了我的要求。
我现在想要在父组件中将一个变化的量传递给子组件，而上面的试验中只是传递了一个小的字符串，而且这个字符串是固定的，是在html里初始化的固定值。我所需要传递的值是在js语句中获得的，并不是html里面的固定值。这个应该怎么操作才能将父组件里js中的变量传递给这个自定义的属性’sensordatasets’中？我所要传递的变量应该是一个类似json格式的很长很长的字符串。
老师有没有比较标准的方法，能否给个代码的例子，用语言描述可能说不明白。
写回答
2回答
-
oldfu
2021-03-29
放到store里不是更方便吗？
00 -
扬_灵
2020-08-12
同学你好，这样的还你可以在data中的先定义一个变量son用来存放传递给sensordatasets的值，当在父组件函数中修改了这个值的时候将这个值赋给son然后在子组件上进行绑定就好了。你可以把下面的值更改为你需要的值,当然你也可以是用一下我们课程代码中使用的provide 和 inject。如果不能解决你的问题，可以继续追问。
<div id="root"> <p>父组件：{{sonValue}}</p> <Son :sensordatasets="sonValue"></Son> <button @click="handleChange">修改父组件内容</button> </div> <script> function registerPlugin() { Vue.component('Son', { props:['sensordatasets'], template: '<div>子组件内容：{{sensordatasets}}</div>', }) } Vue.use(registerPlugin) new Vue({ el: '#root', data(){ return{ sonValue: '展示父组件数据' // 传递的值 } }, methods:{ handleChange(){ this.sonValue="修改父组件的值" // 修改后的值 } } }) </script>00
相似问题