博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Vuex 小tip
阅读量:6324 次
发布时间:2019-06-22

本文共 838 字,大约阅读时间需要 2 分钟。

vuex基本使用和相关规范

  1. dispatch提交action,commit提交mutation。dispatch是异步,commit 是同步
  2. 通过使用,import和mapActions 可以获取action的方法并且能够直接调用或重命名调用
  3. 只允许通过mutation 来变更state的状态(内容)

官方Action介绍

import {        mapActions    } from 'vuex'        ...mapActions({        getListsData: 'getListsData'    })

使用的相关小技巧

  • 可以通过this.$store.state.这种方法取到state里面的值并进行修改(不推荐)
  • dispatch和commit的时候,第二个参数可以带一个载荷,这是一个json,且不允许有第三个参数
  • 一般将数据请求写在action中,如果对数据渲染有先后顺序的要求,可以将整个请求用promise return
getShopData({ commit }, resData) {        return axios.post(url, resData).then((res) => {            commit('getShopData', res)            commit('displayPoints')            commit('setShopScore', res.data.shopDetail.recommendScore)            commit('getShopDetailIntro')        })    }
  • 这种方法一般是和页面直接引入action函数时连用
_this.getShopData().then()

建议

  1. vuex虽然使用起来特别方便,但是对于小型项目,组件划分不要太细
  2. 提交状态尽量按照标准写法来提交,不要直接修改状态

转载地址:http://wxmaa.baihongyu.com/

你可能感兴趣的文章
MVC5 的MicrosoftOwinSecurity扩展插件——微信,QQ登录第三方源码
查看>>
分布式系统理论基础 - CAP
查看>>
mysql 用户管理和权限设置
查看>>
【项目管理和构建】十分钟教程,eclipse配置maven + 创建maven项目
查看>>
[转]Asp.Net大型项目实践(11)-基于MVC Action粒度的权限管理【续】【源码在这里】(在线demo,全部源码)...
查看>>
Numpy 的ndarray
查看>>
牛人博客 列表
查看>>
数据库连接池dataesoruce pool深入理解
查看>>
vuejs2.0使用Sortable.js实现的拖拽功能
查看>>
oracle多实例的启动与关闭
查看>>
码农生涯杂记_4
查看>>
利用jQuery设计横/纵向菜单
查看>>
unity游戏开发之NGUI的UISprite染色
查看>>
HDOJ find the safest road 1596【最短路变形】
查看>>
高度决定视野眼界决定世界
查看>>
shell脚本路径写法的注意点
查看>>
Testng生成的测试报告乱码解决办法
查看>>
vim快速入门
查看>>
大杂烩 -- 单向链表是否存在环或是否相交
查看>>
关键字检索高亮标出-javasript/jQuery代码实现
查看>>