vuex 理解
为什么要用vuex?页面由多个视图组成,用户操作会引视图的状态变化。
- 多个视图依赖于同一状态(例如:菜单导航)
来自不同视图的行为需要变更同一状态(例如:评论弹幕)
vuex 的作用
- 为vue.js开发的状态管理模式
- 组件状态集中管理
组件状态改变遵循统一的规则
vuex 使用store.js
state:组件状态
mutations:唯一可以改变vuex状态的方法集。
vuex的使用
在组件1(info.vue)中引store.js:import store from '@/store'(@代表src目录),
在组件1中的methods中引用store.js中定义的方法,并将状态变化值保存在store.js中
其它组件(about.vue)要引用组件1中改变的值就要引入store.js
vuex可以理解为状态管理中央,由store.js来实现。
注意:vuex刷新页面状态就没了,所以需要localStorage或者sessionStorage来配合
下面是具体的使用方法:
1.查询数据:this.$store.state.name | this.$store.getters.getUsername
2.修改数据:this.$store.dispatch('changeName', 'newname')
vuex 理解的更多相关文章
- vuex理解之modules小记
好记性不如烂笔头 demo预览 源代码 前情提要 关于vuex,其实很久以前就研究使用过,还研究过 flux,redux之类的体系,当时感觉对于 state,action,dispatch,views ...
- VueX理解
什么是Vuex? 官方说法:Vuex 是一个专为 Vue.js应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化. 个人理解:Vue ...
- Vuex理解与使用
1.Vuex是什么 Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式,用于管理页面的数据状态.提供统一数据操作的生态系统.在组件中可以任意获取仓库中的数据.和Vuex类似的还有redux ...
- vuex所有核心概念完整解析State Getters Mutations Actions
vuex是解决vue组件和组件件相互通信而存在的,vue理解起来稍微复杂但一旦看懂择即为好用 安装: npm install --save vuex 引入 import Vuex from 'vuex ...
- vue2.x中请求之前数据显示以及vuex缓存的问题
在项目中遇到两个问题,简单的做个笔记来记录自己解决的问题,可能不是很好的处理办法,欢迎提出,自己还在不断优化中... 第一个是vue在加载页面的时候,会先加载静态资源,这个时候数据还没有请求回来,用户 ...
- 前端Vue框架-vuex状态管理详解
新人报道!多多关照-多提宝贵意见 谢谢- vuex理解 采用集中式存储管理模式.用来管理组件的状态,并以自定义规则去观测实时监听值得变化. 状态模式管理理解 属性 理解 state 驱动应用的数据源 ...
- MVC和MVVM设计模式简单理解
1.mvc设计模式理解 Model: 模型 持有所有的数据状态和业务逻辑; 泛指数据库,链接数据库,建立数据模型 View: 视图 用来展示数据模型在页面上,泛指前端 Controller: 控制器, ...
- 干货分享:vue2.0做移动端开发用到的相关插件和经验总结(2)
最近一直在做移动端微信公众号项目的开发,也是我首次用vue来开发移动端项目,前期积累的移动端开发经验较少.经过这个项目的锻炼,加深了对vue相关知识点的理解和运用,同时,在项目中所涉及到的微信api( ...
- Vue 全家桶
第 1 章:Vue 核心 1.1. Vue 的基本认识1.1.1. 官网1) 英文官网: https://vuejs.org/2) 中文官网: https://cn.vuejs.org/ 1.1.2. ...
随机推荐
- 使用RESTful风格开发
什么是RESTful风格? REST是REpresentational State Transfer的缩写(一般中文翻译为表述性状态转移),REST 是一种体系结构,而 HTTP 是一种包含了 RES ...
- .prop() vs .attr()
.prop() vs .attr() Update 1 November 2012 My original answer applies specifically to jQuery 1.6. My ...
- nmealib-0.5.3 问题 Build Error: undefined reference to `ceil'
When building on Ubuntu 12.x the build fails with the following error… gcc samples/generate/main.o - ...
- 集合循环删除问题-报错java.util.ConcurrentModificationException解析
java.util.ConcurrentModificationException 异常问题详解 环境:JDK 1.8.0_111 在Java开发过程中,使用iterator遍历集合的同时对集合进行修 ...
- python基础之面向对象(二)
一点提醒 首先在使用pickle读取load时,需要先把使用到的类import上,否则会报错.在pycharm中使用时不会报错,但在linux或者cmd时就会报错!必须import. 报错提示: Fi ...
- (十)会话跟踪技术之Session
---部分转自孤傲苍狼博客 一.Session简单介绍 在WEB开发中,服务器可以为每个用户浏览器创建一个会话对象(session对象),注意:一个浏览器独占一个session对象(默认情况下).因此 ...
- CRM-项目记录
硬件篇 阵列R5 3个盘才能做R5阵列,还需要单独的一个SSD硬盘做系统盘 软件篇 跨域问题 SPRINGMVC 配置了跨域,也使用了跨域注解,但是依然不能解决问题 最后通过直接修改TOMCAT的WE ...
- UIwindow ---密码框
程序运行显示结果如下 : 验证密码输入错误显示如下: 代码如下 : 1> //// PasswordInputWindow.m// UIWindow--密码框//// Created by ...
- 【Leetcode_easy】717. 1-bit and 2-bit Characters
problem 717. 1-bit and 2-bit Characters 题意:solution1: class Solution { public: bool isOneBitCharacte ...
- 利用windows任务计划备份sqlserver
sqlserver Express版不含agent service(虽然可以从“服务”里看到,但是无法启动),因此无法使用代理服务执行备份作业,如果代理作业服务正常,建议还是首先采用代理服务. 此备份 ...