Vue实际工作中使用代码！

weixin_45796807

于 2021-02-08 17:16:21 发布

阅读量168

点赞数

CC 4.0 BY-SA版权

分类专栏： vue.js 文章标签： vue javascript vue.js es6

本文链接：https://blog.csdn.net/weixin_45796807/article/details/113759608

vue.js 专栏收录该内容

6 篇文章

订阅专栏

本文介绍如何在Vue组件中，父组件通过props传递引用类型数据（如字符串或布尔值），子组件通过计算属性获取并利用watch监听其变化。重点在于演示如何正确设置计算属性和watch，以便实时响应数据更新。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1、父组件传参，子组件接收，子组件 props 处理引用类型代码:
重点是：引用类型监听

props: {
     disabled: {
         type: Boolean,
         default: false,
     },
     value: {
        type: String,
         default: '',
     },  
 },

在计算属性中获取

computed :{
	setSelectVal() {
      return this.value
    },
}
在计算属性中 记得需要 要return 把值 传出去

在watch 中监听他的动态

	watch:{
		setSelectVal: (newV, oldV) => {
     		 console.log('1', newV)
   		  },
		}