vuex 的简单使用
程序员文章站
2022-03-15 10:00:15
...
vuex是一个专门为vue.js设计的集中式状态管理架构。这篇文章主要介绍了vuex 的简单使用,需要的朋友可以参考下
什么是Vuex?
vuex是一个专门为vue.js设计的集中式状态管理架构。状态?我把它理解为在data中的属性需要共享给其他vue组件使用的部分,就叫做状态。简单的说就是data中需要共用的属性。
1.在vue 组件中
执行enabledcheckbox方法 ,true 为参数,用来改变state中的值
this.$store.dispatch("enabledcheckbox",true)
从state获取useredit的值
this.$store.state.useredit
2 在vuex导出的对象对添加 值到state
添加 mutations 来改变state的值
添加 actions 来 mutations
import Vue from 'vue' import vuex from 'vuex' Vue.use(vuex) export default new vuex.Store({ state: { useredit: false, }, mutations: { ENABLEDCHECKBOX(state, value) { state.checkboxDisable = value }, }, actions: { enabledcheckbox({ commit }, value) { commit('ENABLEDCHECKBOX', value) }, } }) //console.log(vuex)
在main.js
import store from './vuex' new Vue({ el: '#app', router, store, render:h=>h(App) })
上面是我整理给大家的,希望今后会对大家有帮助。
相关文章:
通过Ajax方式上传文件使用FormData进行Ajax请求
以上就是vuex 的简单使用的详细内容,更多请关注其它相关文章!
上一篇: 实现vuex的初始化方法
下一篇: php上传文件的原理
推荐阅读
-
python 使用正则表达式按照多个空格分割字符的实例
-
手把手教你使用 virtualBox 让虚拟机连接网络的教程
-
Vue中 Vue.component() 的使用
-
C++ —— 非类中使用const定义常量的初始化,以及#define和typedef的区别
-
学习python的第十八天(模块导入及使用,关键字,模块搜索路径,python文件的两种用途)
-
css中相对定位和绝对定位的介绍与使用
-
angular的路由ui-router的使用详解
-
知方可补不足~sqlserver中触发器的使用
-
使用 doctrine orm 如何在程序逻辑上实现在一张表完成两个外键的设置(或则说一个实体完成两个多对一的关系)?
-
Node.js实战 建立简单的Web服务器_javascript技巧