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 相关文章推荐
js不能跳转到上一页面的问题解决方法
Mar 01 Javascript
Js+php实现异步拖拽上传文件
Jun 23 Javascript
基于JavaScript实现根据手机定位获取当前具体位置(X省X市X县X街道X号)
Dec 29 Javascript
JavaScript时间操作之年月日星期级联操作
Jan 15 Javascript
ajax 提交数据到后台jsp页面及页面跳转问题
Jan 19 Javascript
完美解决浏览器跨域的几种方法(汇总)
May 08 Javascript
jQuery插件FusionCharts绘制的2D条状图效果【附demo源码】
May 13 jQuery
jquery一键控制checkbox全选、反选或全不选
Oct 16 jQuery
axios发送post请求,提交图片类型表单数据方法
Mar 16 Javascript
浅谈vue项目4rs vue-router上线后history模式遇到的坑
Sep 27 Javascript
vue引入静态js文件的方法
Jun 20 Javascript
vue Treeselect下拉树只能选择第N级元素实现代码
Aug 31 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
对Session和Cookie的区分与解释
2007/03/16 PHP
php 日期和时间的处理-郑阿奇(续)
2011/07/04 PHP
批量去除PHP文件中bom的PHP代码
2012/03/13 PHP
php实现简单的MVC框架实例
2015/09/23 PHP
PHP变量的作用范围实例讲解
2020/12/22 PHP
Jquery实现仿腾讯微博发表广播
2014/11/17 Javascript
JavaScript SHA-256加密算法详细代码
2016/10/06 Javascript
Node.js websocket使用socket.io库实现实时聊天室
2017/02/20 Javascript
js实现常见的工具条效果
2017/03/02 Javascript
利用js查找数组中指定元素并返回该元素的所有索引示例
2017/03/29 Javascript
JS jQuery使用正则表达式去空字符的简单实现代码
2017/05/20 jQuery
Web制作验证码功能实例代码
2017/06/19 Javascript
JS非空验证及邮箱验证的实例
2017/08/11 Javascript
react-router v4如何使用history控制路由跳转详解
2018/01/09 Javascript
微信小程序实现列表下拉刷新上拉加载
2020/07/29 Javascript
node结合swig渲染摸板的方法
2018/04/11 Javascript
vue 注册组件的使用详解
2018/05/05 Javascript
JavaScript ES6常用基础知识总结
2019/02/09 Javascript
Vue Autocomplete 自动完成功能简单示例
2019/05/25 Javascript
angular组件间传值测试的方法详解
2020/05/07 Javascript
django富文本编辑器的实现示例
2019/04/10 Python
10招!看骨灰级Pythoner玩转Python的方法
2019/04/15 Python
解决.ui文件生成的.py文件运行不出现界面的方法
2019/06/19 Python
通过python实现windows桌面截图代码实例
2020/01/17 Python
python安装sklearn模块的方法详解
2020/11/28 Python
pycharm + django跨域无提示的解决方法
2020/12/06 Python
美国指甲油品牌:Deco Miami
2017/01/30 全球购物
给同事的道歉信
2014/01/11 职场文书
小学班级特色活动方案
2014/08/31 职场文书
关于九一八事变的演讲稿2014
2014/09/17 职场文书
担保书范文
2015/01/20 职场文书
2015年社区中秋节活动总结
2015/03/23 职场文书
多表查询、事务、DCL
2021/04/05 MySQL
Redis Cluster 字段模糊匹配及删除
2021/05/27 Redis
Vue3.0 手写放大镜效果
2021/07/25 Vue.js
python前后端自定义分页器
2022/04/13 Python