关于vue中的数据传递的响应以及watch的理解

首先看看这篇说的https://www.cnblogs.com/1032473245jing/p/11102919.html

1.将父组件数据赋值给子组件数据，子组件间接使用，数据仅在mounted中渲染，父组件数据改变子组件数据不改变，需要用watch监听，可以深度监听

2.子组件直接使用父组件传递的数据，父组件数据改变子组件改变，不管这个对象有多少层，都能响应变化，这一点我也是多次试过的

第2种的案例

那么我这种情况应该是属于第2种，那么为什么不行呢，因为我的对象不是响应式的，没有成为data中的响应式数据

我看了一下，原来是因为我的那个对象没有定义在data中。。。。。。，真是笑死我了。。。。。这种低级错误

后来，我把对象放在data里定义了，就都可以了。。。。。。。。。。

没放之前，也就是data中都没写这个数据。。。。，可以看到就是一个普通对象

放了之后，也就是data中定义了之后，可以很明显的看到对象是响应式的了。。。。

那么我这里这种是属于典型的第2种，子组件直接使用父组件传递的数据，而不是赋值给子组件的data里的数据，这样，注意都是直接改，子组件改了传的数据，父组件也会响应，父组件改了传的数据，子组件也会响应，不论多少层，所以如果你遇到使用第1种，但是没效果，那么不要怀疑别的，就是你哪里写的不对罢了

 

第1种的案例

而上次我做的那个api模板里的api步骤的编辑，传了一个对象下去，那种情况，是吧传的值赋值给了子组件里的数据，那是典型的第1种，所以直接改是没效果的，因为你子组件用的数据，和你传的数据已经是两份不同的数据了，你说你改了会有用吗，会互相影响吗，是不会的，那么就需要让他们互相影响对不对，这样就和第2种的效果一样了呀，那么如何让他们能够响应式的互相影响呢，

用watch监听就行了，如果需要父组件传的那个数据改了之后能够影响子组件赋值的那个数据，那么监听父组件传的这个数据(注意对象的话要深度监听{deep:true},不然监听不到对象的变化),然后拿到newVal，也就是最新的值之后，赋值给子组件里那些被赋值的数据，它们不就响应成最新的了吗

如果需要子组件改了之后，父组件的数据也动态改变，那么监听子组件的那个被赋值的数据就好了，拿到newVal，也就是最新的值之后，赋值给父组件传过来的那个数据，

它不就更新了吗，变成了子组件更改之后的最新的数据

 

 

关于watch能监听哪些东西

vue中的watch监听，除了监听data中的数据

还可以监听props、$route、$emit、computed

https://www.cnblogs.com/zhilu/p/13826375.html

watch能监听vuex吗 ，可以 看这篇，可以通过监听computed

https://www.cnblogs.com/eternityz/archive/2020/02/07/12272527.html

其实就像兴长信达那样吧state ....mapstate(['token'])放到computed中，然后watch又通过监听computed，这不就监听到了vuex了吗