广告
返回顶部
首页 > 资讯 > 前端开发 > JavaScript >一篇文章教你简单使用Vue的watch侦听器
  • 694
分享到

一篇文章教你简单使用Vue的watch侦听器

2024-04-02 19:04:59 694人浏览 泡泡鱼
摘要

目录侦听器watch 格式设置侦听器:总结侦听器watch  函数名就是要侦听的元素的名字 传入的参数第一个是变化后的新值newval,第二个是变化前的旧值oldv

侦听器watch 

  • 函数名就是要侦听的元素的名字
  • 传入的参数第一个是变化后的新值newval,第二个是变化前的旧值oldval 

格式

方法格式的侦听器

  • 无法在刚进入页面时自动触发,只有在侦听到变化才会触发
  • 如果侦听的是对象,当对象的属性发生变化时,不会侦听到

对象格式的侦听器

  • 通过immediate选项,可以让侦听器自动触发
  • 通过deep选项,使侦听器深度侦听到对象中属性的变化

这是Vue实例中的data对象:

在这里插入图片描述

设置侦听器:

下面分别是方法格式的侦听器和对象格式的侦听器:

方法格式的侦听器实现的是,当input中内容变化时,触发侦听,侦听input中的内容(内容是与tem绑定好的),如果当前input中的内容不在already数组中,就添加到already中,否则弹出提示框该名称已存在

对象格式的侦听器实现的是,页面一旦载入就立即触发侦听,侦听foo对象name属性的变化。

在这里插入图片描述

总结

本篇文章就到这里了,希望能够给你带来帮助,也希望您能够多多关注编程网的更多内容!

--结束END--

本文标题: 一篇文章教你简单使用Vue的watch侦听器

本文链接: https://www.lsjlt.com/news/159452.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • 一篇文章教你简单使用Vue的watch侦听器
    目录侦听器watch 格式设置侦听器:总结侦听器watch  函数名就是要侦听的元素的名字 传入的参数第一个是变化后的新值newval,第二个是变化前的旧值oldv...
    99+
    2022-11-12
  • 一篇文章教你使用枚举来实现java单例模式
    目录传统的单例写法解决了什么问题仍然存在的问题为什么枚举就没有问题总结传统的单例写法解决了什么问题 首先,在大多数情况下(不包含面试),传统的单例写法已经完全够用了。通过 synch...
    99+
    2022-11-12
  • 一篇文章带你了解C语言二分查找的简单应用
    目录前言实战演练思路分析总结前言 在有序数组中查找具体的某个数字n,可能有同学会说一个一个找,但是这样的效率实在太低,特别是对于有序的数组,效率太低。我们一般从中间元素开始找,查一次...
    99+
    2022-11-12
  • 一篇文章教会你使用java爬取想要的资源
    目录说明方法摘要常用的Element节点方法实战:爬取B站番剧Maven代码说明 简介: 你还在为想要的资源而获取不到而烦劳吗?你还在为你不会python而爬取不到资源而烦劳吗?没关...
    99+
    2022-11-12
  • 一篇文章带你了解Vue组件的创建和使用
    目录一、什么是组件?二、创建全局组件方式一1、Vue.extend2、Vue.component方式二直接使用Vue.component方式三三、 创建局部组件四、组件中的data ...
    99+
    2022-11-12
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作