我意识到我的props传递到一个组件，并在组件中更改，可能会冒泡。这在文档中提到。
当对象和数组作为prop传递时，虽然子组件不能改变prop绑定，但它将能够改变对象或数组的嵌套属性。
我在Vue Playground上重新创建了一个类似的案例。正如你所看到的，在Comp.vue组件中推送'hello'会改变父App.vue中的prop值。
文档中没有建议打破这种绑定的方法。我认为在组件中创建单一引用（从props对象）会打破这种链接，但正如代码所示，情况并非如此。
真正密封元件的正确方法是什么？
注意事项：我需要组件中的变量是React性的，以便在组件模板中使用它们（并在运行时修改它们）这在another question及其答案中提到，但对于像我这样的嵌套数组对象没有解决方案。
2条答案
按热度按时间5cnsuln71#
我设法通过将props分散到组件的reactive变量中来打破React性链接。
字符串
从那时起，
books在组件中是React性的，并继承props值，但它的更改不会传播回父组件。z6psavjg2#
首先，我不是很清楚你想问什么，你在操场上的代码告诉我，你可能想使用可写计算，
const name = ref(props.data.Name)只会创建一个以props.data.Name为默认值的新ref，所以当props更新时它不会改变。那么关于你的问题
真正密封元件的正确方法是什么？
我认为改变prop的属性不是一个好方法，但是vue允许你这样做。好的方法是用event更新值。
v-model也是一个prop和一个eventv-model:visible="xxx"=>:visible="xxx"@update:visible="xxx"你可以在你的组件中创建一个引用，并观察你的 prop ，当引用改变时，做一个事件来询问父组件，当 prop 改变时更新你的引用。而且它已经在useVModel in @vue/use中实现了，我建议你可以尝试使用它并阅读他们的代码。