大多数父组件往子组件传值的情景都是:
父组件传值—>子组件通过props接收父组件传值—>子组件通过插值表达式{{Value}}去显示值
但是!!总会有不同的情景出现!
当我在使用element组件库时候就遇到了如下情况:
一个很简单的表单组件,但是它的数据显示是通过model属性绑定的,因而这里我们不能去使用表达式去处理了。一开始我想,那也很简单啊,你不是要绑定值吗,我在data里去写一个form值,然后再给这个form绑定上父组件传来的值不就完事了嘛。看上去是可行的,但是,事实往往不遂人意,这样是行不通的。原因是,data属性只是一个初始值,并不会实现数据绑定的效果,因此我这种妄图通过data实现父子组件值绑定的思路破产了。
下面是正解(通过watch:监听器实现):
ps:更好的方法可以通过计算属性computed去实现同样的效果,从性能上较优
欢迎大家纠错和讨论。