computed 和 watch 组合使用,监听数据全局数据状态
我要实现的就是,当接口返回数据时,我在任何组件中都能感知到到该数据的变化,然后根据业务逻辑进行处理、展示。
实现这个效果的方式很多,比如当接口返回数据后,就emit这数据,在另外组件中on接收渲染即可,但是我不想用这种,
所以就换了另外一种方式:当接口返回数据时,将数据commit到state,需要对其作出反应的组件中,使用computed将
计算属性将混入到 Vue 实例中,也就是在计算属性中返回某个状态。同时使用watch对其属性变化进行监听,且进行相关处理。
相关代码如下:
接口返回数据后,commit更新state中的数据。
mutations中的操作是:
需要对该变化作出反应的组件中,代码如下,其中watch里面可进行相应业务处理。
computed 和 watch 组合使用,监听数据全局数据状态的更多相关文章
- Android 监听ContentProvider的数据改变
今天介绍一下怎么监听ContentProvider的数据改变,主要的方法是:getContext().getContentResolver().notifyChange(uri,null),这行代码是 ...
- Android_通过ContentObserver监听短信数据变化
1.简单介绍 在小米等一些机型,无法接收系统发出的短信广播. 仅仅能通过观察者ContentObserver,去监听短信数据的变化 2.SMS数据介绍 content://sms/inbox ...
- 20、解决Vue使用bus兄弟组件间传值,第一次监听不到数据
1.新建bus.js文件: import Vue from 'vue' export default new Vue; 2.在需要通信组件A,B中引入bus: A组件: import Bus from ...
- 小程序的数据监听 用法和vue中的watch一样====使用通配符监听所有自数据字段的变化
使用通配符监听所有自数据字段的变化
- 监听Listview的滚动状态,是否滚动到了顶部或底部
/** * @author:Jack Tony * @description : 监听listview的滑动状态,如果到了顶部就刷新数据 * @date :2015年2月9日 */ private c ...
- vue computed计算属性和watch监听属性解疑答惑
computed计算属性 计算属性类似于方法,用于输出data中定义的属性数据的结果,data数据变化时,计算属性的结果会同步变化,需要注意的是计算属性不可与data定义的属性同名. 相比于方 ...
- .Net客户端监听ZooKeeper节点数据变化
一个很简单的例子,用途是监听zookeeper中某个节点数据的变化,具体请参见代码中的注释 using System; using System.Collections.Generic; using ...
- 监听指定端口数据交互(HttpListenerContext )
很怀念以前做机票的日子,,,,可惜回不去 以前的项目中的,拿来贴贴 场景:同步第三方数据,监听指定地址(指定时间间隔,否则不满足,因为需要处理粘包问题,改篇未实现) 主要内容四个文件:下面分别说下每个 ...
- 小程序批量获取input的输入值,监听输入框,数据同步
在使用小程序时,跟vue的数据绑定不一样,没有v-model这个属性了,官网也只是给了一些事件监听. 但是我们如果有多个表单时,需要写多个事件来同步数据.这样做很麻烦.下面的方法可以解决,只需要一个方 ...
随机推荐
- <c:out>标签中有一个escapeXml属性 如果为escapeXml="false",则将其中的html、xml解析出来。
<td><c:out value="${s.name}" escapeXml="false"></c:out></td ...
- AlphaPose ubuntu16 python2安装
#https://www.tensorflow.org/install/install_linux#ValidateYourInstallation #https://github.com/MVIG- ...
- c语言学习笔记 多级else if 和switch case有什么区别
; ) { dosth(); } ) { dosth2(); } else if(opion==) { dosth3(); } else dosth4(); 如果给option的一个值是2的话,那么程 ...
- Codeforces 427E Police Patrol
找中间的数,然后从两头取. #include<stdio.h> ; int pos[MAX]; int main() { int n,m,tmp; int i; int pol; long ...
- myeclipse自动化提示
jsp自动提示:1.快捷键提示代码 window-->Preferences的General-->Keys下修改Content Assist的快捷键为Alt+/,这样就可以通过快捷键得到提 ...
- (字符串)ZigZag Conversion
[解析] 第一次看到这个题目的人,可能不知道ZigZag是什么意思,简单解释一下,就是把字符串原顺序012345……按下图所示排列: 发现所有行的重复周期都是 2 * nRows - 2 对于首行和末 ...
- (转)基于 WPF + Modern UI 的 公司OA小助手 开发总结
原文地址:http://www.cnblogs.com/rainlam163/p/3365181.html 前言: 距离上一篇博客,整整一个月的时间了.人不能懒下来,必须有个阶段性的总结,算是对我这个 ...
- 编写高质量代码改善C#程序的157个建议——建议49:在Dispose模式中应提取一个受保护的虚方法
建议49:在Dispose模式中应提取一个受保护的虚方法 在标准的Dispose模式中,真正的IDisposable接口的Dispose方法并没有做实际的清理工作,它其实是调用了下面的这个带bool参 ...
- 【单例模式】Singleton pattern
前言:有很多时候,在一个生命周期中我们只要一个对象就可以了,比如:线程池,缓存,对话框,日志,显卡驱动等等.如果造出多个实例,就会导致许多问题产生,例如:程序的行为异常.资源使用过量,或者说不一致的结 ...
- [转]B+Tree图解
一, M阶B+树的定义(M阶是指一个节点最多能拥有的孩子数,M>2): 图1.1 3阶B+树 (1)根结点只有1个,分支数量范围[2,m]. (2)除根以外的非叶子结点,每个结点包含分支数 ...