vuex导入_vuex简单使用示例

1、创建vue项目

vue create vuex-store-test

2、导入vuex，新建vuex.store并导出

目录结构

src

--store

----index.js

import Vue from 'vue'

import Vuex from 'vuex'

Vue.use(Vuex)

const store = new Vuex.Store({

state: {

count: 0

},

mutations: {

increment(state) {

state.count++

}

}

})

export default store

3、使用store

begin

{{ count }}

end

##引入store

import store from "@/store";

export default {

name: 'HelloWorld',

props: {

msg: String,

},

data() {

return {

message: 'welcome',

##使用store

count: store.state.count

}

},

methods: {

increment() {

store.commit('increment')

console.log(this.$store.state.count)

}

}

4、运行项目并访问

npm install --save vuex

npm run serve