最近发现在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. Kafka笔记6(数据传递的可靠性)

    Kafka保证分区消息的顺序,“先入先出” 只有当消息被写入分区的所有副本时,才被认为已提交的 只要有一个副本是活跃的,已提交的消息就不会丢失 消费者只能读取已经提交的消息 如果一个或多个副本在同步/ ...

  2. 记录Django学习1

    一.Django 1.首先安装好django模块 pip3 install django 2.然后配置好相应的环境变量 C:\Python35\Scripts 3. 创建Django工程,首先可以使用 ...

  3. vue国际化

    插件:vue-i18n main.js引入i18n.js:+2行 新建文件(i18n.js),引入VueI18n.locale.语言包 新建语言包,包括index/zh/en(名字随意,引用正确就好) ...

  4. 插播一则关于HTTP Headers详解~~~

    URL REQUEST : ------ 使用通讯录请求对象,构建URLLoader对象,并发出数据请求(对指定地址发出数据请求)   status code(状态码)------ 200(成功)-- ...

  5. archlinux中安装Oracle12c的过程中遇到的问题

    INFO: : cannot find INFO: /usr/lib64/libpthread_nonshared.aINFO: INFO: genclntsh: Failed to link lib ...

  6. CentOS 搭建git服务

    git服务器的搭建是非常简单的. 1. 安装git yum install git 2. 创建用户git groupadd git adduser git -g git passwd git 3. 创 ...

  7. 【数据结构】算法 LinkList (Reverse LinkedList) Java

    反转链表,该链表为单链表. head 节点指向的是头节点. 最简单的方法,就是建一个新链表,将原来链表的节点一个个找到,并且使用头插法插入新链表.时间复杂度也就是O(n),空间复杂度就需要定义2个节点 ...

  8. you've successfully authenticated, but Gitee.com does not provide she access.

    如果都是正常的生成ssh的操作,还是会报这个错误,那么就是.... 你没更改文件夹的权限,这个坑跳了很久(汗...) sudo chmod 777 -r 文件夹

  9. Android的JSON数据解析

    一. 使用原生方式解析 准备工作:准备一个布局文件,用来显示元数据与转换之后的数据 <?xml version="1.0" encoding="utf-8" ...

  10. tinkpad e450c 进入 BIOS

    电脑开机状态下重启电脑,同时连续单击F1 听到"嘟"的一声继续按F1键即可进入BIOS管理界面. 注意:此时Fn要在锁定状态,即Fn键盘灯亮.[可用Fn+Esc切换Fn锁定和未锁定 ...