少廢話，先出東西 vuex

main.js

import Vue from 'vue' import App from './App' import router from './router' import store from './store' Vue.config.productionTip = falsenew 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>

總結

以上是生活随笔為你收集整理的vuex小例的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。