本文给大家介绍了使用vuex的state状态对象的5种方式,给大家贴出了我的vuex的结构,感兴趣的朋友跟随本站小编一起学习吧
vuex是一个专门为vue.js设计的状态管理模式,并且也可以使用devtools进行调试。
下面给大家来贴一下我的vuex的结构
下面是store文件夹下的state.js和index.js内容
//state.js
const state = {
headerBgOpacity:0,
loginStatus:0,
count:66
}
export default state
//index.js
import Vue from 'vue'
import Vuex from 'vuex'
import state from './state'
import actions from './actions'
import getters from './getters'
import mutations from './mutations'
Vue.use(Vuex)
export default new Vuex.Store({
state,
actions,
getters,
mutations
})
立即学习“前端免费学习笔记(深入)”;
下面开始在test.vue组件当中使用vuex的state状态对象
方式一
{{$store.state.count}}
立即学习“前端免费学习笔记(深入)”;
方式二
{{count}}
立即学习“前端免费学习笔记(深入)”;
方式三
{{count}}
立即学习“前端免费学习笔记(深入)”;
方式四
{{count}}
立即学习“前端免费学习笔记(深入)”;
方式五
{{count}}
立即学习“前端免费学习笔记(深入)”;
以上就是本文的全部内容,希望对大家的学习有所帮助,更多相关内容请关注PHP中文网!
相关推荐:
关于Vue2 Vue-cli中使用Typescript的配置介绍
立即学习“前端免费学习笔记(深入)”;










