在vue中使用watch监听对象或数组
最近发现在vue中使用watch监听对象或者数组时,当数组或者对象只是单一的值改变时,并不会出发watch中的事件。
在找问题过程中,发现当数组使用push一类的方法时,会触发watch,如果只是单一改变,如object[index] = newData,并不会触发,而对象同理。
解决方法:
使用vue的set方法
即 this.$set(Object,index,newdata)
Object为你需要改变的数组,index为要改变的数组下标,newdata为新值。
这样的话,watch中的监听事件就会被触发。
在vue中使用watch监听对象或数组的更多相关文章
- vue中的数据监听以及数据交互
现在我们来看一下vue中的数据监听事件$watch, js代码: new Vue({ el:"#div", data:{ arr:[,,] } }).$watch("ar ...
- vue中如何深度监听一个对象?
大家都知道,Vue项目中对数据的监听,提供了一个很好的钩子watch,watch可以极其方便的监听我们常用数据类型值的变化,但通常当我们想监听一个对象中,某个属性值的变化时,很难达到我们预期的效果.那 ...
- vue中watch深度监听
监听基本类型的都是浅度监听 watch的深度监听,监听复杂类型都是深度监听(funciton ,arrat ,object) // 监听对象 data(){ return { a:{ b:, c: } ...
- vue中的事件监听之——v-on vs .$on
跟着视频中老师的教学视频学vue的时候,看很多时候都用@(v-on)来监听子级emit的自定义事件,但在bus总线那块,又用.$on来监听bus自身emit的事件,v-on之间似乎相似但又不同,今天对 ...
- vue 2.0 watch 监听对象的变化
- vue中输入框事件监听 v-on:input
<van-field v-model="inputVal" v-on:input="search" />
- 在nodejs中利用 Proxy监听对象值的获取
1 window = new Proxy(global, { 2 get: function (target, key, receiver) { 3 console.log("window. ...
- Vue之watch监听对象中某个属性的方法
新建 userinfo = { name: "小明", age: "18", } vue中watch监听name的方法 1. 可以结合计算属性的方法实现 { ...
- vue 监听对象里的特定数据
vue 监听对象里的特定数据变化 通常是这样写的,只能监听某一个特定数据 watch: { params: function(val) { console.log(val) this.$ajax.g ...
随机推荐
- sklearn中报错ValueError: Expected 2D array, got 1D array instead:
from sklearn.linear_model import LinearRegression lr = LinearRegression() print(tr_x.shape,tr_y.shap ...
- 快速学习C语言途径,让你少走弯路
1.标准C语言能干什么? 坦白讲,在今天软件已经发展了半个多世纪,单纯的C语言什么都干不了.标准C语言库只提供了一些通用的逻辑运算方法以及字符串处理,当然字符串在C语言看来也是一种操作内存的方法,所以 ...
- js选中变色,不选中鼠标放上变色
<head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8&quo ...
- 论文速读(Chuhui Xue——【arxiv2019】MSR_Multi-Scale Shape Regression for Scene Text Detection)
Chuhui Xue--[arxiv2019]MSR_Multi-Scale Shape Regression for Scene Text Detection 论文 Chuhui Xue--[arx ...
- jdk5升级至jdk8框架版本选型
spring-framework-4.3.18.RELEASE 4.3.x+:JDK8 Spring JDK Version Range Spring Framework 5.1.x: JDK 8- ...
- python之dict(或对象)与json之间的互相转化
在Python语言中,json数据与dict字典以及对象之间的转化,是必不可少的操作. 在Python中自带json库.通过import json导入. 在json模块有2个方法, loads():将 ...
- css基础教程
css规则有两个主要部分构成:选择器,以及一条或多条声明. 值的不同写法和单位: 可以使用十六进制设置颜色值:#ff0000; 为节约字节,使用css缩写形式:#f00: 类选择器:以一个点号显示. ...
- Mysql 导入文件提示 --secure-file-priv option 问题
MYSQL导入数据出现:The MySQL server is running with the --secure-file-priv option so it cannot execute this ...
- CCF CSP 201509-1 数列分段
题目链接:http://118.190.20.162/view.page?gpid=T32 问题描述 试题编号: 201509-1 试题名称: 数列分段 时间限制: 1.0s 内存限制: 256.0M ...
- es6转es5 在线转换工具
es6转es5 在线转换工具 Babeljs es6console