Vuex的基本使用

相对于vuex来说,我看了一上午都没看懂,后来通过百度别人的Demo和反复查阅官方文档

终于大概了解vuex的主要用法,关于概念什么的就不多说了,直接看官网的更详细:https://vuex.vuejs.org/zh-cn/getting-started.html

下面说说在webpack中如何引入并使用vuex:

在 Vue 之后引入 vuex 会进行自动安装:

<script src="/path/to/vue.js">script>
<script src="/path/to/vuex.js">script>

NPM

npm install vuex --save

Yarn

yarn add vuex

然后在main.js中引入:


import store from './vuex/store'


接下来创建storoe.js

Vuex的基本使用_第1张图片


然后编写store.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++  

} 

}

}

})

 在App.vue或者其他组件中引入:

import store from './vuex/store'
可以在computed等其他地方这样引用,用法可以自己多去实践

computed: {
  main() {
    return store.state.count
  }


你可能感兴趣的:(Vue2.0,vue2.0,vuex)