vue如何监听props改变,vue props验证
这篇文章主要介绍了Vue3.0中如何监听小道具方法，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教
目录
Vue3.0如何监听小道具第一种第二种vue3.0监听小道具做数据回显
Vue3.0如何监听props
学习vue3.0记录下小道具监听：
第一种
直接监听这个小道具
导出默认定义组件({
道具：{
isOpen:布尔型，
},
发出：{
close-modal: null，
},
设置（道具、上下文){
手表（
道具，
（新道具)={
控制台。日志(新道具。iso笔)；//这里看到新值
}
);
const closeModal=()={
context.emit("关闭模式");
};
返回{
关闭模式，
};
},
});
第二种
监听里边的某一个属性
导出默认定义组件({
道具：{
isOpen:布尔型，
},
发出：{
close-modal: null，
},
设置（道具、上下文){
手表（
()=props.isOpen，
（新道具)={
控制台。日志(新道具)；//查看新值
}
);
const closeModal=()={
context.emit("关闭模式");
};
返回{
关闭模式，
};
},
});
vue3.0监听props做数据回显
模板
/模板
脚本
从“vue”导入{defineComponent，reactive，watch }；
导出默认定义组件({
名称："发件人",
道具：{
记录：{
类型：对象，
默认值：null，
}
},
设置：功能（道具、上下文){
const formState=reactive({
头像： ,
昵称： ,
密码： ,
用户名： ,
roleDomainList: []
});
/*监听道具*/
手表（道具，(nweProps，oldProps)={
对于(让项目处于表单状态){
formState[item]=新道具。记录[项目]；
}
});
返回{
表单状态
};
}
})
/脚本
样式范围
/风格
以上为个人经验，希望能给大家一个参考，也希望大家多多支持我们。
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。