个人笔记-----Vuex创建store.js和使用【如有不对，欢迎指正】

创建

store.js相当于一个共享库，把很多共享的数据存放在这个store.js中，其他页面想取用，需要到store.js这个页面中取用，如果想改变数据也需要到store.js中修改数据。
创建store.js需要以下几步:
1，在src下面新建一个vuex文件夹，
2，在vuex创建store.js，
3，在store.js中引用vue和vuex，并且使用vuex，
4，定义数据，在State里面进行定义数据，
5，定义方法，在mutation里面定义方法，
6，将vuex实例暴露出去，以便其他的任何文件进行共享数据，

import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

const store = new Vue.Store({
    state:{
        count:1
    },
    mutations:{
        increment(state){
            state.count++
        }
    }
})
export default store

使用

主要有,四个步骤
1，在A组件中引入store.js import store from '../vuex/store.js'
2，然后进行注册

    export default {
        data() {
            return {
                
            }
        },
        store,
    }

3，在DOM中进行使用 {{ this.$store.state.count}}

4，然后再methods 中通知 store.js

	methods:{
         incre(){
             this.$store.commit('increment')
         }
    },

---

<template>
    <div>
        <p>A组件</p>
        <br><br><br>
        <p>{{ this.$store.state.count}}</p>
        <button @click="incre">+</button>
    </div>
</template>

<script>
    import store from '../vuex/store.js'
    export default {
        data() {
            return {
                
            }
        },
        methods:{
            incre(){
                this.$store.commit('increment')
            }
        },
        store,
    }
</script>

将vuex实例暴露出去，以便其他的任何文件进行共享数据，

export default store