美文网首页Vue
vue 中 vuex 的使用

vue 中 vuex 的使用

作者: 齐铭_3488 | 来源:发表于2019-03-11 14:31 被阅读51次

(1):在项目中安装vuex,安装好之后在项目src文件夹下新建stroe文件

(2):在stroe文件中新建4个文件,分别是:action.js; index.js; mutation.js; state.js

(3):在state.js中定义所需的 state (以常量的方式),并且引入在工具类(utils)中定义的get方法,用get方法来获取存在cookie中的对应的state, 最后 export default state

(4):在mutations.js中定义mutations (以常量的方式),mutations中定义的方法如: SET_ID: (state, data) => {state.id = data} ,是以vuex的方式,在mutations中修改存在vuex的对应的state的值,每一个方法的形参都须包括(state, data), 最后 export default mutations

(5):在actions.js中定义 actions (以常量的方式),actions 中定义的方法如:Login ({commit}, userInfo) {return new Promise((resolve, reject) => {userLogin(userInfo).then(res => {const data = res.data resolve(data) }) }) } ,可以在action中以异步的方式调用mutationions 中定义改变state的方法

(6):使用action中调用的方法:例如 调用Login: this.$store.dispatch('Login', data).then(res => {console.log(res)}).catch(err => {console.log(err)})

相关文章

  • Vuex 的基本使用

    添加 vuex 的依赖 vue 中配置 vuex 打开 main.js 使用 vuex main.js 中的代码 ...

  • vue双向数据绑定vuex中的state

    vue双向数据绑定vuex中的state 在vue中, 不允许直接绑定vuex的值到组件中, 若是直接使用, 则会...

  • vue2 vuex的使用

    vuex在vue2中的使用与在vue3中不同,首先,需要安装vuex3而不是vuex4,然后,需要在全局中进行定义...

  • Vuex笔记

    Vuex 安装插件 Vue use(Vuex) 创建对象 module是模块的意思,为什么在Vuex中我们要使用模...

  • vuex基础

    vuex Vuex是什么呢?它是Vue的状态管理模式,在使用vue的时候,需要在vue中各个组件之间传递值是很痛苦...

  • vuex使用记录

    副标题:vuex使用详解、vue使用全局变量、vue使用 store 这篇博客主要记录了 vuex的使用方法,简单...

  • vue安装veux

    现在使用npm i 会默认安装vuex4,vuex4只适用于vue3,如果使用的vue环境是vue3,安装vuex...

  • vue组件传值&vuex

    vue技术分享 目录 vue组件之间的通信 vue中数据监听watch的使用 vuex状态管理 vue-aweso...

  • Vue总结第一篇

    Vue使用vuex和localStorage

  • 2019-01-19

    Vue+Vuex+axios+sass项目: 抽空整理了一下使用vue-cli创建vue项目并在项目中使用Vuex...

网友评论

    本文标题:vue 中 vuex 的使用

    本文链接:https://www.haomeiwen.com/subject/ftfbpqtx.html