我们在工作经常会有组件嵌套的情况，内部组件通过props获取传递进来的数据。不过在实际应用中发现，外部组件的数据更新后，内部组件的数据不会实时更新：

子组件：

COPYHTML

父级组件：

COPYHTML

这么个组件运行是没有问题的，能够正确渲染出一个列表。

可是如果list.vue中的users发生变化时，unit.vue里的数据是不会再次更新的。这样的情况怎么解决呢？

解决方案1： 将两个组件合并成一个组件

最简单、最粗糙的方式，将两个组件合并成一个组件，在一个组件内进行数据更新，就不会出现组件之间数据不同步的问题了。

不过这样的的问题就是，当前组件会很大，本来我们就是为了解耦功能，才要拆分组件的，不能再次回到过去吧。

解决方案2： watch

在unit.vue组件中，使用watch监听某个属性的变化，这样外部的数据发生变化时，watch就能监听到：

COPYJAVASCRIPT
watch: {
    'user.age': function(val, oldVal){
        this.render(); // user中的age属性发生变化时，调用render方法
    }
}