Vue2.0用 watch 观察 prop 变化(不触发)


Posted in Javascript onSeptember 08, 2017

本文介绍了Vue2.0用 watch 观察 prop 变化(不触发),分享给大家,具体如下:

A 组件:

export default {
 props:{
 name:{
 type:String
 }
 },
 data () {
 return {
  author: "Jinkey"
 }
 },
 mounted:function(){
 this.author = 'lili'
 },
 watch:{
 name:function(){
 console.log(this.name);
 },
 author:function(){
 console.log('lili');
 }
 }
}

author 有监测到变化,并输出了 lili ; name 由 B 组件传入,却没有监测到,控制台没有输出。

在 B 组件里调用 A 组件,并传值给 name

<firstcomponent :name="name"></firstcomponent>

import firstcomponent from './component/firstcomponent.vue'
export default {
 data () {
 return {
  msg: 'Hello Vue!',
  name:'lili'
 }
 },
 components: { firstcomponent}
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery与ExtJS之选择实例分析
Aug 19 Javascript
jquery仿京东导航/仿淘宝商城左侧分类导航下拉菜单效果
Apr 24 Javascript
JS 实现导航菜单中的二级下拉菜单的几种方式
Oct 31 Javascript
jQuery学习之DOM节点的插入方法总结
Jan 22 Javascript
JS设计模式之惰性模式(二)
Sep 29 Javascript
jquery radio 动态控制选中失效问题的解决方法
Feb 28 jQuery
Node.js readline模块与util模块的使用
Mar 01 Javascript
详解vue使用vue-layer-mobile组件实现toast,loading效果
Aug 31 Javascript
react高阶组件添加和删除props
Apr 26 Javascript
layui select 禁止点击的实现方法
Sep 05 Javascript
javascript实现fetch请求返回的统一拦截
Dec 22 Javascript
详解vue2 $watch要注意的问题
Sep 08 #Javascript
Express + Session 实现登录验证功能
Sep 08 #Javascript
Vue中组件之间数据的传递的示例代码
Sep 08 #Javascript
详解jquery插件jquery.viewport.js学习使用方法
Sep 08 #jQuery
JavaScript实现开关等效果
Sep 08 #Javascript
浅谈React Native 中组件的生命周期
Sep 08 #Javascript
Vue仿手机qq的实例代码(demo)
Sep 08 #Javascript
You might like
php日历[测试通过]
2008/03/27 PHP
PHP版自动生成文章摘要
2008/07/23 PHP
php将fileterms函数返回的结果变成可读的形式
2011/04/21 PHP
PHP中怎样保持SESSION不过期 原理及方案介绍
2013/08/08 PHP
Smarty中调用FCKeditor的方法
2014/10/27 PHP
PHP实现在线阅读PDF文件的方法
2015/06/17 PHP
基于Jquery实现的一个图片滚动切换
2012/06/21 Javascript
一个简单的弹性返回顶部JS代码实现介绍
2013/06/09 Javascript
JS获取网页属性包括宽、高等等
2014/04/03 Javascript
Node.js的特点和应用场景介绍
2014/11/04 Javascript
12个非常实用的JavaScript小技巧【推荐】
2016/05/18 Javascript
JavaScript中setTimeout的那些事儿
2016/11/14 Javascript
js实现简易聊天对话框
2017/08/17 Javascript
JS封装的模仿qq右下角消息弹窗功能示例
2018/08/22 Javascript
VueJS实现用户管理系统
2020/05/29 Javascript
vue 动态给每个页面添加title、关键词和描述的方法
2020/08/28 Javascript
[01:07:11]Secret vs Newbee 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/17 DOTA
Python的一些用法分享
2012/10/07 Python
python cx_Oracle的基础使用方法(连接和增删改查)
2017/11/19 Python
python实现聊天小程序
2018/03/13 Python
python+opencv 读取文件夹下的所有图像并批量保存ROI的方法
2019/01/10 Python
python实现在线翻译功能
2020/03/03 Python
python实现将字符串中的数字提取出来然后求和
2020/04/02 Python
Python填充任意颜色,不同算法时间差异分析说明
2020/05/16 Python
使用jupyter notebook运行python和R的步骤
2020/08/13 Python
纯CSS3+DIV实现小三角形边框效果的示例代码
2020/08/03 HTML / CSS
波兰多品牌运动商店:StreetStyle24.pl
2020/09/22 全球购物
类、抽象类、接口的差异
2016/06/13 面试题
大学生全国两会报告感想
2014/03/17 职场文书
单位法定代表人授权委托书
2014/09/20 职场文书
幼儿园新学期开学寄语
2015/05/27 职场文书
离婚起诉书范文2016
2015/11/26 职场文书
《七律·长征》教学反思
2016/02/16 职场文书
详解运行Python的神器Jupyter Notebook
2021/06/03 Python
无线电通信名词解释
2022/02/18 无线电