vue云彩流动怎么做

发布网友 发布时间：2022-03-27 13:17

我来回答

共1个回答

热心网友 时间：2022-03-27 14:47

vue的核心是数据驱动，所有数据变更的时机很重要，也就是watch的内容，一般是数据逻辑的操作。在使用vuex的项目中，我们在vuex中只是发请求、拿数据，在视图中来进行逻辑的操作、数据的更新。

1.vuex的作用，vuex在我的理解是这样的

我们把多个组件的共用数据放在vuex这个容器中，在视图中我们用过import引入这个state数据或者action方法，我们就拿到了vuex中的数据，有了数据我们在视图中，可以读取这些数据，但是不能更改，vuex中的数据只能在mutation中更改，如果在视图中更改，vue会发出警告，我一开始觉得不方便，但是其实如果大家都可以在视图找那个更改vuex的公共数据，那么数据就会变得混乱，vuex这样做确实是很合理的。

举个例子，我们想请求一个数组，我们把这个请求数组的方法写在actions中并用export 来暴露这个方法，我们在视图中(vue 文件)中引入，给一个按钮加监听，调用这个方法，这个方法在actions中执行，在actions中返回数据，我们根据返回的状态码进行判断成功失败。我们在action是的回调中执行dispath或者commit，把返回的数据提交到对应的mutation中，我们在index中定义state并暴露，在mutation中引入state，这样在mutation中我们把action中传过来的数据，赋值给state，最后我们在视图中引入index.js，我们就这样拿到了请求的数据。这个过程就是这样

vue视图请求-->(action-->mutation-->getter)-->index.js ---> vue视图拿到数据。

2.关于watch数据

拿到数据就可以了吗？当然不是我们要对数据进行处理，我们在举个例子，假如我们拿到数据后，我们要把这个数组赋值给data中的arr数组，并且打印出数组的长度，那么我们怎么知道拿到数据了呢？我们需要对拿到的vuex中的数据进行watch，我们来判断只要这个数据改变，我们就把数组赋值，并且打印数据。

我们打印成功了数据，但是我们再次点击按钮，为什么数据不打印了呢？arr的值是对的，但是不打印arr的length了，因为我们watch的值并没有发生改变，因为两次返回的值是相同的，所有我们会在每次请求前，调用一个request方法，来把我们监听的数据重置，当然这样我们打印了两次，所以我们数据逻辑怎么写要看具体情况。