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 validation插件表单验证的一个例子
Mar 03 Javascript
JavaScript定义类或函数的几种方式小结
Jan 09 Javascript
javascript高级学习笔记整理
Aug 14 Javascript
基于jquery封装的一个js分页
Nov 15 Javascript
Jquery实现侧边栏跟随滚动条固定(兼容IE6)
Apr 02 Javascript
Windows8下搭建Node.js开发环境教程
Sep 03 Javascript
JavaScript中this详解
Sep 01 Javascript
动态创建按钮的JavaScript代码
Jan 29 Javascript
Vue2.0利用 v-model 实现组件props双向绑定的优美解决方案
Mar 13 Javascript
vue+vuex+axios实现登录、注册页权限拦截
Mar 09 Javascript
Js经典案例的实例代码
May 10 Javascript
vue使用canvas实现移动端手写签名
Sep 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
简单的过滤字符串中的HTML标记
2006/12/25 PHP
PHP 字符截取 解决中文的截取问题,不用mb系列
2009/09/29 PHP
Thinkphp中数据按分类嵌套循环实现方法
2014/10/30 PHP
PHP实现的简单日历类
2014/11/29 PHP
php微信公众号js-sdk开发应用
2016/11/28 PHP
PHP使用mongoclient简单操作mongodb数据库示例
2019/02/08 PHP
Prototype源码浅析 Number部分
2012/01/16 Javascript
jquery选择器需要注意的问题
2014/11/26 Javascript
angularjs中的单元测试实例
2014/12/06 Javascript
提升jQuery的性能需要做好七件事
2016/01/11 Javascript
jquery if条件语句的写法
2016/05/19 Javascript
在html中引入外部js文件,并调用带参函数的方法
2016/10/31 Javascript
Vue自定义指令介绍(2)
2016/12/08 Javascript
jquery实现异步加载图片(懒加载图片一种方式)
2017/04/24 jQuery
微信小程序封装http访问网络库实例代码
2017/05/24 Javascript
VSCode中如何利用d.ts文件进行js智能提示
2018/04/13 Javascript
基于axios 解决跨域cookie丢失的问题
2018/09/26 Javascript
vue视频播放插件vue-video-player的具体使用方法
2019/11/08 Javascript
jquery获取input输入框中的值
2019/11/13 jQuery
VUE 动态组件的应用案例分析
2019/12/02 Javascript
小程序如何定位所在城市及发起周边搜索
2020/02/11 Javascript
基于aotu.js实现微信自动添加通讯录中的联系人功能
2020/05/28 Javascript
Python利用QQ邮箱发送邮件的实现方法(分享)
2017/06/09 Python
Python tkinter模块中类继承的三种方式分析
2017/08/08 Python
pandas 对series和dataframe进行排序的实例
2018/06/09 Python
python  创建一个保留重复值的列表的补码
2018/10/15 Python
解决PySide+Python子线程更新UI线程的问题
2019/01/11 Python
在pandas中遍历DataFrame行的实现方法
2019/10/23 Python
Selenium之模拟登录铁路12306的示例代码
2020/07/31 Python
CSS3 函数技巧 用css 实现js实现的事情(clac Counters Tooltip)
2017/08/15 HTML / CSS
巴西最大的家电和百货零售商:Casas Bahia
2016/11/22 全球购物
意大利体育用品和运动服网上商店:Maxi Sport
2019/09/14 全球购物
上班玩游戏检讨书
2014/02/07 职场文书
《愚公移山》教学反思
2014/02/20 职场文书
运动会新闻报道稿
2015/07/22 职场文书
Python if else条件语句形式详解
2022/03/24 Python