vue3 中 props 传递响应式值不会变

vue3 中 通过 props 传递响应式值不会跟着响应式,原因为获取 props 的时候 直接通过 props.xxx 来获取了,如果要保持响应式,需要手动转为响应式

const { status } = toRefs(props)

// or

const status = toRef(props, 'status')

当组件层级比较深的时候,为避免 props 多级传递,可以使用 provide, inject,注意,如果要保证传递的数据为响应式,要直接传响应式数据,而不是最终获取的值

// 父组件
const status = ref(0)
provide('status', status)

// 子组件
const status = inject('status')

 

posted @   蓓蕾心晴  阅读(2445)  评论(0编辑  收藏  举报
相关博文:
阅读排行:
· 阿里最新开源QwQ-32B,效果媲美deepseek-r1满血版,部署成本又又又降低了!
· SQL Server 2025 AI相关能力初探
· AI编程工具终极对决:字节Trae VS Cursor,谁才是开发者新宠?
· 开源Multi-agent AI智能体框架aevatar.ai,欢迎大家贡献代码
· Manus重磅发布:全球首款通用AI代理技术深度解析与实战指南
点击右上角即可分享
微信分享提示