vuex小例

少废话，先出东西 vuex

main.js

import Vue from 'vue'
import App from './App'
import router from './router'
import store from './store'
Vue.config.productionTip = false


new Vue({
	el: '#app',
	router,
	store,
	render: xx=>xx(App)
})

store.js 平级目录未建文件夹

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

Vue.use(Vuex)

//访问状态对象
const state = {
	count : 4
} 
//访问触发状态
const mutations = {
	jia(state) {
		state.count ++
	},
	jian(state) {
		state.count --
	}
}

export default new Vuex.Store({
	state,
	mutations
})

App.vue

<template>
  <div id="app">
    <h1>hello world</h1>
    <h1>{{ this.$store.state.count }}</h1>
    <button @click="$store.commit('jia')">count + 1</button>
    <button @click="$store.commit('jian')">count - 1</button>
    <!-- <router-view></router-view> -->
  </div>
</template>