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 chosen动态设置值实例介绍
Aug 08 Javascript
常用的JavaScript验证正则表达式汇总
Nov 26 Javascript
JavaScript中函数(Function)的apply与call理解
Jul 08 Javascript
js仿苹果iwatch外观的计时器代码分享
Aug 26 Javascript
BootStrap入门教程(三)之响应式原理
Sep 19 Javascript
bootstrap datetimepicker实现秒钟选择下拉框
Jan 05 Javascript
关于javascript作用域的常见面试题分享
Jun 18 Javascript
详解使用angularjs的ng-options时如何设置默认值(初始值)
Jul 18 Javascript
微信小程序 input表单与redio及下拉列表的使用实例
Sep 20 Javascript
vue 解决addRoutes动态添加路由后刷新失效问题
Jul 02 Javascript
vue实现移动端图片上传功能
Dec 23 Javascript
Element中Slider滑块的具体使用
Jul 29 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实现根据设备类型自动跳转相应页面的方法
2014/07/24 PHP
PHP处理postfix邮件内容的方法
2015/06/16 PHP
PHP类的特性实例分析
2016/09/28 PHP
PHP curl批处理及多请求并发实现方法分析
2018/08/15 PHP
ThinkPHP中获取指定日期后工作日的具体日期方法
2018/10/14 PHP
JS获取浏览器版本及名称实现函数
2013/04/02 Javascript
js判断undefined变量类型使用typeof
2013/06/03 Javascript
Jquery chosen动态设置值实例介绍
2013/08/08 Javascript
扩展JS Date对象时间格式化功能的小例子
2013/12/02 Javascript
JavaScript实现把rgb颜色转换成16进制颜色的方法
2015/06/01 Javascript
javascript简易画板开发
2020/04/12 Javascript
Vue2.0 vue-source jsonp 跨域请求
2017/08/04 Javascript
Vue单页应用引用单独的样式文件的两种方式
2018/03/30 Javascript
JavaScript寄生组合式继承原理与用法分析
2019/01/11 Javascript
超详细动手搭建一个VuePress 站点及开启PWA与自动部署的方法
2019/01/27 Javascript
详细解析Python当中的数据类型和变量
2015/04/25 Python
python实现教务管理系统
2018/03/12 Python
Python selenium实现微博自动登录的示例代码
2018/05/16 Python
使用pandas read_table读取csv文件的方法
2018/07/04 Python
NumPy 数学函数及代数运算的实现代码
2018/07/18 Python
如何把外网python虚拟环境迁移到内网
2020/05/18 Python
python各种excel写入方式的速度对比
2020/11/10 Python
Unineed旗下时尚轻奢网站:FABHunt
2019/05/13 全球购物
Intersport西班牙:在线体育商店
2019/11/06 全球购物
焊接专业毕业生求职信
2013/10/01 职场文书
车间操作工岗位职责
2013/12/19 职场文书
2014新年元旦活动策划方案
2014/02/18 职场文书
餐饮总经理岗位职责
2014/03/07 职场文书
建议书标准格式
2014/03/12 职场文书
《路旁的橡树》教学反思
2014/04/07 职场文书
食品安全汇报材料
2014/08/18 职场文书
学校运动会广播稿
2014/10/11 职场文书
青年岗位能手事迹材料
2014/12/23 职场文书
2015年餐厅服务员工作总结
2015/04/23 职场文书
解除合同协议书范本
2016/03/21 职场文书
html+css实现分层金字塔的实例
2021/06/02 HTML / CSS