vue一个父子之间传值的问题研究

       之前一直使用react开发,所以响应式开发过程特别是在父子组件传值的过程不需要考虑很多问题 ,可在vue中很多问题变得似乎很麻烦例如下面的问题:

      父子组件传值的过程vue和react是一样的

     父给子传:用props

     子给父传:子组件在特定的事件emit一个信号和所传值,在父组件定义方法接收并作出想要的改变。

 

    子给父传值是发射一个信号所以没什么问题,问题在于 父给子传的时候:  如果是一个传值并不会改变页面中的变量的时候,也就是这个传的值并没有在页面用插值表达式或者别的方式直接展示界面用到,而只是单纯的想要传递一个值的时候,可能这个变量会在哪个函数中调用一下,这个值在父组件改变的时候,子组件不会响应式改变!

    所以该怎么办:  react似乎是没有这个问题的 (好久没敲了  忘了是否有这个问题 但只记得当时没这个坎)

   vue的解决办法是监听  用watch监听  监听父组件传值是否变化了  变了调用那些函数  例如echarts的生成函数等  这是vue的解决办法

 

   总结:  vue中父子组件单纯传值的时候 这个值不是会直接改变页面  没有在页面中调用的时候  而是在子组件的函数中有调用  如果想做出响应式改变  需要用watch监听父组件传的值 再在watch中调不同函数改变。  

当然还可以用vuex和bus  但是如果你想建立一个架构完整 不混杂的项目工程  不要轻易引用各种各样的插件。

 

另外一个小知识点  vue 的watch中对每一个变量监听的时候  别用箭头函数  this是找不到vue实例的 ,要用function

 

       

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值