【发布时间】：2019-10-28 21:31:00
【问题描述】：
我的问题更多的是寻找解释。
我有两个组件，父亲和孩子。
父亲：
<template>
<Child :data="testData" />
{{testData}} //for print data in father
</template>
<script>
export default {
name: "Father",
data() {
return {
testData: {name: "hello"}
}
}
}
</script>
然后是我的孩子
<template>
<input v-model="data.name" />
</template>
<script>
export default {
name: "Child",
props: ["data"]
}
}
</script>
正如文档在本节中所说： https://vuejs.org/v2/guide/components-props.html#One-Way-Data-Flow
我预计它会返回错误，但不，它可以工作，如果我尝试更改输入，父组件会显示正确的新值，而不会出现控制台错误。
所以我用简单的字符串测试了数据而不是父亲中的对象，例如：
父亲：
<template>
<Child :data="testData" />
{{testData}} //for print data in father
</template>
<script>
export default {
name: "Father",
data() {
return {
testData: "hello"
}
}
}
</script>
儿童：
<template>
<input v-model="data" />
</template>
<script>
export default {
name: "Child",
props: ["data"]
}
}
</script>
在这种情况下，我会得到正确的错误：
[Vue 警告]：避免直接改变一个 prop，因为它的值是 每当父组件重新渲染时被覆盖。相反，使用 基于道具值的数据或计算属性。道具存在 变异：“数据”
发现于
是的，我知道在 JS 中对象是不同的并且是“神奇的”，但我希望 Vuejs 不允许这样做。
这是期望/应有的（针对 JS 细节）行为吗？
谢谢。
【问题讨论】：
-
我不完全确定你在问什么，这是对 为什么 Vue 使用只有一种方式的道具的解释吗？
-
是的，我在问为什么 vue 的 props 应该只有一种方式，而对象却不是。
-
你是什么意思对象不是一种方式？他们是，因此您收到的错误。 （是的，它仍然会修改它，但在使用 Vue 时这是不好的做法）
-
不，如果我使用对象，我不会收到错误。这是我的问题，为什么我没有收到对象错误，对象为 {name: "hello"}
-
对不起，伙计，我看错了这个问题。我会解决这个问题，看看我能为你找到什么，因为我自己也不确定。
标签： javascript vue.js vuejs2