我们已经在Child组件上同步了属性并关注这个道具。此属性设置为默认值(无需查询(
如果我们不提供从父组件到子组件的道具，有什么方法可以强制观察子组件的属性变化吗？
演示：https://codesandbox.io/s/vue-watch-sync-prop-bug-demo-lofei
我从下面的两个组件中添加了一些代码。
-Parent.vue
<template>
<!-- watch inside not works if remove ':message.sync' here -->
<Child :message.sync="message" />
</template>
<script>
import Child from "./Child";
export default {
name: "Parent",
components: { Child },
data: function (params) {
return {
message: "",
};
},
};
</script>
-Child.vue
<template>
<div>message: {{ messageValue }}</div>
</template>
<script>
export default {
name: "Child",
props: {
message: {
type: String,
default: "",
},
},
computed: {
messageValue: {
get() {
return this.message;
},
set(value) {
this.$emit("update:message", value);
},
},
},
watch: {
message(value) {
// this not executing
},
},
};
</script>
尝试将immediate:true添加到手表属性：
watch: {
message:{
handler(value) {
},
immediate:true
}
},