最近发现在vue中使用watch监听对象或者数组时，当数组或者对象只是单一的值改变时，并不会出发watch中的事件。

在找问题过程中，发现当数组使用push一类的方法时，会触发watch，如果只是单一改变，如object[index] = newData，并不会触发，而对象同理。

解决方法：

使用vue的set方法

即 this.$set(Object,index,newdata)

Object为你需要改变的数组，index为要改变的数组下标，newdata为新值。

这样的话，watch中的监听事件就会被触发。

在vue中使用watch监听对象或数组的更多相关文章

  1. vue中的数据监听以及数据交互

    现在我们来看一下vue中的数据监听事件$watch, js代码: new Vue({ el:"#div", data:{ arr:[,,] } }).$watch("ar ...

  2. vue中如何深度监听一个对象？

    大家都知道,Vue项目中对数据的监听,提供了一个很好的钩子watch,watch可以极其方便的监听我们常用数据类型值的变化,但通常当我们想监听一个对象中,某个属性值的变化时,很难达到我们预期的效果.那 ...

  3. vue中watch深度监听

    监听基本类型的都是浅度监听 watch的深度监听,监听复杂类型都是深度监听(funciton ,arrat ,object) // 监听对象 data(){ return { a:{ b:, c: } ...

  4. vue中的事件监听之——v-on vs .$on

    跟着视频中老师的教学视频学vue的时候,看很多时候都用@(v-on)来监听子级emit的自定义事件,但在bus总线那块,又用.$on来监听bus自身emit的事件,v-on之间似乎相似但又不同,今天对 ...

  5. vue 2.0 watch 监听对象的变化

  6. vue中输入框事件监听 v-on:input

    <van-field v-model="inputVal" v-on:input="search" />

  7. 在nodejs中利用 Proxy监听对象值的获取

    1 window = new Proxy(global, { 2 get: function (target, key, receiver) { 3 console.log("window. ...

  8. Vue之watch监听对象中某个属性的方法

    新建 userinfo = { name: "小明",  age: "18", } vue中watch监听name的方法 1. 可以结合计算属性的方法实现 { ...

  9. vue 监听对象里的特定数据

    vue  监听对象里的特定数据变化 通常是这样写的,只能监听某一个特定数据 watch: { params: function(val) { console.log(val) this.$ajax.g ...

随机推荐

  1. Fiddler使用总结（转载）

    原文地址:https://www.cnblogs.com/yyhh/p/5140852.html 序章 Fiddler是一个蛮好用的抓包工具,可以将网络传输发送与接受的数据包进行截获.重发.编辑.转存 ...

  2. django中static的坑

    在django搭建网络平台的时候免不了要使用到static来保存静态文件, 在static文件夹里包含两个文件:css和js文件,如果使用不当就会出现很多问题 第一个坑:配置文件settings.py ...

  3. C# 合并只要有交集的所有集合

    using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...

  4. 一般程序中的session

    在WebHandler中无法访问session: IRequiresSessionState必须实现这个接口(不包含任何方法的标记接口), 需要导入using System.Web.SessionSt ...

  5. Python实现bp神经网络识别MNIST数据集

    title: "Python实现bp神经网络识别MNIST数据集" date: 2018-06-18T14:01:49+08:00 tags: [""] cat ...

  6. Django框架详细介绍---认证系统

    在web开发中通常设计网站的登录认证.注册等功能,Django恰好内置了功能完善的用户认证系统 1.auth模块 from django.contrib import auth 模块源码 import ...

  7. 父网访问子网（校园网访问校园网IP路由器下的一台电脑）远程路由器下的电脑

    网路由器添加转发规则,端口转发,本人仅使用Pandora Box路由器固件 当然设置了这些还不够,还需要设置其他的允许端口转发的东西,例如 然后远程桌面的话还需要设置某些相关设置,例如电脑允许使用远程 ...

  8. Hibernate的load和get方法的区别

    这次我们聊一下Hibernate3.2 Session加载数据时get和load方法的区别,我总结的如下: 1. 对于get方法,hibernate会确认一下该id对应的数据是否存在,首先在sessi ...

  9. [dart学习]第二篇：dart变量介绍 （一）

    前言 本文的所有内容均是官方文档的简单翻译和理解,需要查看原文,请登录  https://www.dartlang.org/guides/language/language-tour  阅读, 让我们 ...

  10. oracle数据库创建用户

    --4.1 创建表空间 CREATE TABLESPACE mdm_data DATAFILE 'D:\soft\Oracle\oracl\oradata\mdm_data01.dbf' SIZE 3 ...