在 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：

Action 会返回 Promise，所以好好利用它吧。

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

我更喜欢这种处理方式，因为 loading 是在您使用它的地方定义和更新的。

选项 2：

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

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