首页 > 其他分享 >Vue3 的watch 监视属性

Vue3 的watch 监视属性

时间:2022-11-11 11:46:22浏览次数:48  
标签:对象 Vue3 watch 新值 老值 监视 监听 属性

1. 监听单个 watch(变量,(新值,老值)=>{})

2. 监听多个 watch([变量1,变量2],(新值,老值)=>{})

3. 监听对象 watch(()=>对象,(新值)=>{})

4. 监听对象属性 watch(()=>对象.属性,(新值,老值)=>{})

5. 监听对象多个属性 watch([()=>对象.属性1,()=>对象.属性2],(新值,老值)=>{})

6. 监听对象属性,且该属性值是引用类型 watch(()=>对象.属性,(新值,老值)=>{},{ deep:true })

大总结: watch(监听目标,执行函数,配置) // 配置主要包含 { deep:true/false,immediate:true/false }

 

watchEffect 函数

作用: 监听函数用到哪些变量,只要这些变量变化就会执行该监听函数; 一开始会自动执行一次 ;

格式:watchEffect(()=>{ // 用到的变量发送变化,就会执行该函数 })

标签:对象,Vue3,watch,新值,老值,监视,监听,属性
From: https://www.cnblogs.com/zhulongxu/p/16880051.html

相关文章

  • Vue3后台系统做一个富文本编辑器
    前言:富文本编辑器的插件网上有很多,有些需要二次开发,有些有框架的限制,也有些稳定性差。我这边开发中由于领导催的紧,所以为了提高一下自己的效率决定使用wangEditor,这个编辑......
  • Vue3学习笔记(五)——路由,Router
    一、前端路由的概念与原理1.1.什么是路由路由(英文:router)就是对应关系。1.2.SPA与前端路由SPA指的是一个web网站只有唯一的一个HTML页面,所有组件的展示与切换都......
  • Vue3学习(八)
    组件学习:子组件:<template><div:title="msg">{{title}}</div><div>{{cnData}}</div><div>{{user}}</div></template><!--<scriptlang="ts">import{d......
  • vite+vue3引入表态图片时出错
    在使用vite开发vue项目时,我们异性习惯vue2的方法导入图片,结果导致各种找不到图片以下是错误方法<img:src="logo"class="login-logo"/>consturl=reactive({lo......
  • vue3:elementPlus的dailog组件title标题位置设置
     按照官网打开弹出窗想要的是这种效果但自己出现的是下面这种,title跑中间了,body区唯一一个控件,也跑到下面了   设置el-dialog__header高度后,高度的确发生了变......
  • Ios tat 监视I/O子系统
     iostat是I/Ostatistics(输入/输出统计)的缩写,用来动态监视系统的磁盘操作活动。11.1.命令格式iostat[参数][时间][次数]11.2.命令功能通过iostat方便查看CPU、网卡......
  • Ios tat 监视I/O子系统
    iostat是I/Ostatistics(输入/输出统计)的缩写,用来动态监视系统的磁盘操作活动。11.1.命令格式iostat[参数][时间][次数]11.2.命令功能通过iostat方便查看CPU、网卡、tty设......
  • vue3中使用vue3-seamless-scroll(最新版本滚动插件)
    npm安装npminstallvue3-seamless-scroll--saveyarn安装yarnaddvue3-seamless-scrollbrowser安装<scriptsrc="https://unpkg.com/browse/vue3-seamless-scr......
  • vue3 递归菜单组件
    有一个需求,就是不知道菜单到底有多少级,需要按照层级一层层地遍历出来递归实现的三个流程:写函数写遍历条件设置终止条件实现逻辑父请求子组件,并且把列表值转给子组......
  • vue3-组合式api-provide/inject
    provide/inject适用于跨级通信,例如在父组件中改变值,在孙组件中通过依赖注入的方式能获取到父组件中改变的这个值一、父组件<template> <div>  <!--子组件-->......