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弹出(alert)select选择的值
Apr 21 Javascript
jquery遍历checkbox的注意事项说明
Feb 21 Javascript
Js实现自定义右键行为
Mar 26 Javascript
Javascript 高阶函数使用介绍
Jun 15 Javascript
AngularJS中scope的绑定策略实例分析
Oct 30 Javascript
JS运动改变单物体透明度的方法分析
Jan 23 Javascript
解决bootstrap中下拉菜单点击后不关闭的问题
Aug 10 Javascript
vue cli 3.x 项目部署到 github pages的方法
Apr 17 Javascript
JavaScript函数IIFE使用详解
Oct 21 Javascript
浅谈vue中$bus的使用和涉及到的问题
Jul 28 Javascript
解决vue scoped html样式无效的问题
Oct 24 Javascript
vue3如何优雅的实现移动端登录注册模块
Mar 29 Vue.js
详解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新手上路(九)
2006/10/09 PHP
基于mootools 1.3框架下的图片滑动效果代码
2011/04/22 Javascript
DOM 中的事件处理介绍
2012/01/18 Javascript
基于jQuery实现图片的前进与后退功能
2013/04/24 Javascript
js实现广告漂浮效果的小例子
2013/07/02 Javascript
JS中自定义定时器让它在某一时刻执行
2014/09/02 Javascript
js判断鼠标左、中、右键哪个被点击的方法
2015/01/27 Javascript
JQuery中节点遍历方法实例
2015/05/18 Javascript
jquery实现顶部向右伸缩的导航区域代码
2015/09/02 Javascript
js实现控制textarea输入字符串的个数,鼠标按下抬起判断输入字符数
2016/10/25 Javascript
react.js 翻页插件实例代码
2017/01/19 Javascript
强大的JavaScript响应式图表Chartist.js的使用
2017/09/13 Javascript
Vue的移动端多图上传插件vue-easy-uploader的示例代码
2017/11/27 Javascript
vue实现引入本地json的方法分析
2018/07/12 Javascript
微信小程序数据分析之自定义分析的实现
2018/08/17 Javascript
微信小程序 wepy框架与iview-weapp的用法详解
2019/04/10 Javascript
Python with的用法
2014/08/22 Python
Python中的urllib模块使用详解
2015/07/07 Python
Python模块future用法原理详解
2020/01/20 Python
python小程序之4名牌手洗牌发牌问题解析
2020/05/15 Python
Python定义一个Actor任务
2020/07/29 Python
Pamela Love官网:纽约设计师Pamela Love的精美、时尚和穿孔珠宝
2020/10/19 全球购物
标记环介质访问控制协议
2016/03/27 面试题
机械化及自动化毕业生的自我评价分享
2013/11/06 职场文书
儿媳婚宴答谢词
2014/01/14 职场文书
新闻编辑自荐书范文
2014/02/12 职场文书
2014年创卫实施方案
2014/02/18 职场文书
2014元旦晚会策划方案
2014/02/19 职场文书
职务聘任书范文
2014/03/29 职场文书
祖国在我心中演讲稿(小学生)
2014/09/23 职场文书
求职简历自荐信怎么写
2015/03/26 职场文书
Nest.js参数校验和自定义返回数据格式详解
2021/03/29 Javascript
python实现三阶魔方还原的示例代码
2021/04/28 Python
MySQL慢查询的坑
2021/04/28 MySQL
如何理解python接口自动化之logging日志模块
2021/06/15 Python
Python django中如何使用restful框架
2021/06/23 Python