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

2022-04-15 0 434
目录
  • 侦听器watch 
  • 格式
  • 设置侦听器:
  • 总结

侦听器watch 

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

格式

方法格式的侦听器

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

对象格式的侦听器

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

这是Vue实例中的data对象:

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

设置侦听器:

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

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

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

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

总结

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

免责声明:
1、本网站所有发布的源码、软件和资料均为收集各大资源网站整理而来;仅限用于学习和研究目的,您必须在下载后的24个小时之内,从您的电脑中彻底删除上述内容。 不得使用于非法商业用途,不得违反国家法律。否则后果自负!

2、本站信息来自网络,版权争议与本站无关。一切关于该资源商业行为与www.niceym.com无关。
如果您喜欢该程序,请支持正版源码、软件,购买注册,得到更好的正版服务。
如有侵犯你版权的,请邮件与我们联系处理(邮箱:skknet@qq.com),本站将立即改正。

NICE源码网 JavaScript 一篇文章教你简单使用Vue的watch侦听器 https://www.niceym.com/21224.html