首先:我们需要在父组件中标签中定义一个 ref=“parentObjVue”

其次:我们在子组件中,通过  var tmp=this.$refs.parentObjVue找到父组件。

然后:我们在子组件中这样去写(例如监听父组件中的一个gdata属性)

tmp.$watch('gdata',(newVal,oldVal)=>{
// 这里就是gdata数据发生变化的时候具体的操作内容,同在自己的组件当中使用watch一样。
})

vue中如何在子组件添加类似于watch属性监听父组件数据,数据变化时子组件做出相应的动作的更多相关文章

  1. Vue ---- 表单指令 条件指令 循环指令 分隔符 过滤器 计算属性 监听属性

    目录 案例讲解: 一. 表单指令 1.重点: 补充 2.单选框 3.单一复选框 4.多复选框 二 . 条件指令 v-if/v-show ... v-clock 三 . 循环指令 string arra ...

  2. Vue中,给当前元素添加类名移除兄弟元素类名的方法

    在Vue中,给当前元素添加类名移除兄弟元素类名的方法 今天在项目中需要做一个效果,点击对应的li改变当前的color,其他的li取消颜色,在jQuery中这很容易,由于之前已经引入了jQuery,所以 ...

  3. vue2.x版本中Object.defineProperty对象属性监听和关联

    前言 在vue2.x版本官方文档中 深入响应式原理 https://cn.vuejs.org/v2/guide/reactivity.html一文的解释当中,Object.defineProperty ...

  4. vue 如何在循环中 "监听" 的绑定v-model数据

    vue 如何在循环中 "监听" 的绑定v-model数据 阅读目录 vue 如何在循环中 "监听" 的绑定v-model数据 1. 普通属性的值进行监听 2. ...

  5. Vue 变量,成员,属性监听

    Vue变量 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF ...

  6. Vue之计算属性Computed和属性监听Watch,Computed和Watch的区别

    一. 计算属性(computed) 1.计算属性是为了模板中的表达式简洁,易维护,符合用于简单运算的设计初衷. 例如: <div id="app"> {{ myname ...

  7. Vue.js之计算属性(computed)、属性监听(watch)与方法选项(methods)

    vue.js官网:https://cn.vuejs.org/v2/guide/components-registration.html 一.计算属性-computed 1. 作用:能够避免数据冗余,通 ...

  8. highcharts图表组件入门教程:如何监听柱状图柱子点击事件动态更新当前数据点数值和所对应X轴刻度

    highcharts图表组件入门教程:如何监听柱状图柱子点击事件动态更新当前数据点数值和所对应X轴刻度 作者:highcharts | 时间:2014-6-11 14:07:05 | [小  大] | ...

  9. vue对象属性监听

    对象属性监听的两种方法: 1.普通的watch data() { return { frontPoints: 0 } }, watch: { frontPoints(newValue, oldValu ...

  10. 12.vue属性.监听.组件

    1.计算属性 https://cn.vuejs.org/v2/guide/computed.html new Vue({ computed:{//定义 show(){ } } }) ++计算属性1.h ...

随机推荐

  1. avue框架 拼接后端返回的数据到table中

    根据要求展示下列详细地址情况: 后端返回的数据: 具体实现步骤: { label: "详细地址", prop: "buildingName", display: ...

  2. 【转载】EXCEL VBA 同时选择多个工作表的方法

    如果要用VBA同时选择多个工作表,可以利用数组或设置"Select"方法的参数为"False"来扩展所选择的内容,如下面的一些代码:   1.用工作表名称:   ...

  3. M.2 SSD固态硬盘上安装windows问题

    近来M2硬盘大降价,笔记就趁便宜买了一个2T的M.2固态硬盘,插在笔记本上,接下来安装win11,本想以前安装多次,也是老手了,没想到遇到很多问题,一度陷入僵局,不过最终还是安装成功了,下面记录下安装 ...

  4. 三台服务器使用docker搭建redis一主二从三哨兵,概念-搭建-整合springboot

    一.前言 redis在我们企业级开发中是很常见的,但是单个redis不能保证我们的稳定使用,所以我们要建立一个集群. redis有两种高可用的方案: High availability with Re ...

  5. Java的深拷贝和浅拷贝的区别

    一.拷贝的引入 (1).引用拷贝 创建一个指向对象的引用变量的拷贝. Teacher teacher = new Teacher("Taylor",26); Teacher oth ...

  6. java基础篇——异常

    异常的三种类型 1.检查型异常:通常是由用户错误或者问题引起,是程序员无法预见的,例如用户要打开一个不存在的文件... 2.运行时异常:最有可能被程序员忽略的异常,可以在编译时被忽略,例如无限递归调用 ...

  7. 解决微信小程序 自定义tabBar 切换时候闪烁问题

    这个闪烁真的很迷 我搜了一些资料,进行了以下步骤的操作 第一种解决办法 ,把tabbar自定义组件的this.setData中的代码注释掉 显示tabbar中的页面中,添加下面的:这个好像没什么用啊 ...

  8. 普冉PY32系列(四) PY32F002/003/030的时钟设置

    目录 普冉PY32系列(一) PY32F0系列32位Cortex M0+ MCU简介 普冉PY32系列(二) Ubuntu GCC Toolchain和VSCode开发环境 普冉PY32系列(三) P ...

  9. Vue28 Web Storage

    https://www.jianshu.com/p/513f6949fc25 1 简介 Web Storage 包括 localStorage 和 sessionStorage ,是浏览器本地数据存储 ...

  10. ASP.NET Core - .NET 6 的入口文件

    自从.NET 6 开始,微软对应用的入口文件进行了调整,移除了 Main 方法和 Startup 文件,使用顶级语句的写法,将应用初始化的相关配置和操作全部集中在 Program.cs 文件中,如下: ...