vuex 基本使用

组件

data () {
    // 需要调用vuex 里面的数据的话
    msgs: this.$store.state.msg
},
methods: {
    add () {
        // 这是 add 的逻辑
        // 本来要写在组件里面的逻辑抽出来放到了 actions 里面的 _add方法里面了
        // 所以在组件内部只要调用 actions 里面的 _add()方法就可以了
        this.$store.dispatch(`_add`)

        // 如果需要传参数
        this.$store.dispatch(`_add`, newMsg)
    }
}

在 vuex 里面的 actions就相当于组件内部的 methods

vuex

state: {
    msgs: []
},
actions: {
    // 如果有参数
    _add ({state}, newMsg) {
        // state 就相当于 组件里面的 data () {}
        // 组件里面的 add 逻辑
        // 假如在组件内部要向 msgs 添加一条内容
        state.msgs.push(newMsg)
    }
}

先简单的记录一下,其实很简单后续有时间了详细介绍