关于vuex的用法 个人心得

关于一些vuex的用法 个人心得 闲时记下 vuex安装 npm install vuex --save

cnpm install vuex --save

cnpm 配置方法

npm install -g cnpm --registry=https://registry.npm.taobao.org

官方文档里面关于vuex的描述

这里只说说 我自己对于vuex用法的理解 如有不对 请指出

首先你要这样

然后 这样

然后 在你的入口文件 一般就是main.js

state: vuex的核心 存放着所有需要使用的数据

以上内容是我项目里面的数据 举个栗子

mutation: 引用官网的依据话。更改 Vuex 的 store 中的状态的唯一 方法是提交 mutation。完美的解释了Mutation的作用。

传递值方式

action: action提交的就是Mutation 因为更改vuex的store中的状态只能够是使用Mutation,所以 action是无法直接修改store的状态的。

action 使用方法 需要注意的是 action提交的是Mutation 不要弄错哦

如果你的项目比较复杂 你还可以这样

使用module 分块方式来进行管理

每一个Js 就是对应某个业务代码的分块 这样的话 维护起来会比较方便

每一个分块 都有自己独立的 state mutation action

最后只需要在index.js 里面引入就可以了

这是getter的写法 这样的话只要getter里面有返回值的 都可以通过 this.$store.getter. ... 取到值

至于最后关于辅助函数的具体用法 下次再讲吧

以上就是我再项目里面使用过的关于vuex的方法 有不对的地方希望大家都指出来哦 一起讨论 一起进步

还有就是上面的代码都是手写的Demo代码 如果出现运行错误的话 也可以指出哦

原文链接:segmentfault.com

上一篇:从一道面试题来了解浏览器渲染过程
下一篇:JavaScript的构造函数

相关推荐

  • 骚操作!在react中使用vuex

    原文地址(https://github.com/zyl1314/blog/issues/12) 前言 笔者最近在学习使用,提到react就绕不过去。redux是一个状态管理架构,被广泛用于rea...

    2 年前
  • 页面刷新后,vuex中数据丢失、清空的解决方案 vuex-persistedstate

    场景之一 应用API进行用户身份验证,将登录状态保存为Vuex状态中的布尔值。 当用户登录时,设置了 登录状态 并相应地有条件地显示 登录/注销 按钮。

    1 年前
  • 速览vuex源码

    Vuex 源码不过千行,主要使用了 Store 类、ModuleCollection 类、Module 类,结构清晰,下面简单说说 Vuex 中一些主要的源码实现。推荐打开 Vuex 源码一同观看。

    1 个月前
  • 逐行粒度的vuex源码分析

    了解vuex 什么是vuex 图片描述(https://img.javascriptcn.com/6de1abc14258c286464237639a9b815f "图片描述") vuex是一...

    1 年前
  • 迅速了解一下 ES10 中 Object.fromEntries 的用法

    Object.fromEntries 方法就是 entries 的逆操作,作用是将一个键值对数组转化为一个对象 同样的该方法也已经成为 ES10 中 stage4 提案: 201903042150...

    1 年前
  • 轻量级网页遮罩层jQuery插件用法实例

    本文实例讲述了轻量级网页遮罩层jQuery插件用法。分享给大家供大家参考。具体如下: 使用jQuery的好处是很多人为它写一些组件,而在项目所需用到功能也都可以找到一些组件去完成。

    3 年前
  • 转行前端一年回顾+一点学习心得

    全文比较长,列个大纲 一、Why choose frontend 二、2017.012017.05(自学) 三、2017.06.012018.06.01(工作一年) 1. 勤奋 2. 养生 3. 学英...

    2 年前
  • 跟我一起从0到1编写一个自己的Vuex

    前言 在前端工程化开发的今天,vuex、redux成为了我们项目中状态管理的上上之选。关于如何使用它,相信这已经成为前端开发者的必备技能之一了。今天,我们来一起尝试进阶一下,自己实现一个状态管理器来...

    4 个月前
  • 详谈js中window.location.search的用法和作用

    用该属性获取页面 URL 地址: window.location 对象所包含的属性 | 属性 | 描述 | | hash | 从井号 () 开始的 URL(锚) | | host | 主机名和当前...

    3 年前
  • 详谈jQuery Ajax(load,post,get,ajax)的用法

    今天看到群里面有网友们问到Jquery Ajax的(load,post,get,ajax)之间的区别,现在整理了一篇文章出来,希望可以帮到网友们,首先我们先来看一些简单的方法, 这些方法都是对j...

    3 年前

官方社区

扫码加入 JavaScript 社区