完成vuex时加载错误

Question

在加载后（发送后）放入错误的正确方法是什么？

例如：（我知道它不起作用）

this.loading = true;
this.$store.dispatch('items', data);
this.loading = false;

<script>
    export default {

        data() {
            return {
                loading: false,
            }
        },


        methods: {

            store() {

                this.loading = true;
                this.$store.dispatch('items', data);

            },
        },
    }
</script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>

Answer 1

有两种方法可以做到这一点。

选项1：

动作会返回承诺，所以要利用它。

this.loading = true;
this.$store.dispatch('items', data)
.then(() => {
   this.loading = false;
})

我更喜欢这种处理方式，因为loading的定义和更新完全在您使用的位置。

选项2：

如果需要在多个组件之间共享loading状态，则很有用。

将loading放入商店的状态，并在items操作中的适当时间对其进行更新。然后，您可以在组件中将loading用作$store.state.loading（或作为计算属性）。