在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 ...
随机推荐
- VMware密匙
5A02H-AU243-TZJ49-GTC7K-3C61N 新版本密室:FF31K-AHZD1-H8ETZ-8WWEZ-WUUVA
- vue路由请求 router
创建一个Router.js文件 // 路由请求//声明一个常量设置路菜单// import Vue from "vue/types/index";import Vue from ' ...
- java生成条形码工具类
package com.runtime.extend.utils.CodeCreate;import java.awt.Color;import java.awt.Font;import java.a ...
- docker容器实战-----初级<2>
第二章 docker容器 1. Docker是通过内核虚拟化技术(namespaces及cgroups cpu.内存.磁盘io等)来提供容器的资源隔离与安全保障等.由于Docker通过操作系统层的虚 ...
- 1. centos下安装docker
CentOS Docker 安装 Docker支持以下的CentOS版本: CentOS 7 (64-bit) CentOS 6.5 (64-bit) 或更高的版本 前提条件 目前,CentOS 仅发 ...
- 微博第三方js-sdk登录
https://open.weibo.com <meta property="wb:webmaster" content="your appkey" /& ...
- was系统的远程调试
1.进入websphere页面 2.servers->server types->websphere application servers->点击Additional Proper ...
- MySQL删除foreign key_ERROR 1025 (HY000): Error on rename of './test_20180206/cc' to './test_20180206/#sql2-9ac-e' (errno: 152)
问题背景描述: 首先,创建了一个主表,具有以下数据结构: mysql> describe aa; +-------+----------+------+-----+---------+----- ...
- MTK-LCM 屏幕使用fbconfig/PanelMaster来调试LCM驱动
屏幕调试是我们做的较多的工作,且以MIPI屏为主,调试时总是会遇到一些参数需要一点一点配的时候,这样的工作其实很是繁琐,在我们确认完硬件没有问题时能不能使用简易的方法来解决这个问题呢 ? MTK已经为 ...
- CS 2505 Computer Organization I C09: Rational Number
CS 2505 Computer Organization I C09: Rational Number Type in CVersion 5.00 This is a purely individu ...