如何为 Vue 组件数据指定类型、默认值和验证器

Question

我有以下组件，并想设置editing 的类型和默认值，它可以切换为显示Item 值或<input>：

    Vue.component('item', {
            props: {
                'item': Item,
                'editing': {
                    type: Boolean,
                    default: false
                },
            },
            data: function() {
                return {
                    _cachedItemText: '',
                }
            },
            methods: {

当按下Edit 按钮（未显示）切换editing 的值时，会出现以下警告。

[Vue 警告]：避免直接改变 prop，因为每当父组件重新渲染时，该值都会被覆盖。相反，使用基于道具值的数据或计算属性。正在变异的道具：“编辑”

在Propsdocumentation 中，有一个示例展示了如何设置道具的类型、默认值和验证器。有没有类似的方法来为数据项设置这些属性？

另外，我没有从父组件传入editing，所以我认为它真的需要成为道具而不是数据项。

Answer 1

[Vue 警告]：避免直接改变 prop，因为每当父组件重新渲染时，该值都会被覆盖。相反，使用基于道具值的数据或计算属性。正在变异的道具：“编辑”

我明白了。您正在将 prop editing 从父组件传递给子组件。然后，在子组件中，您使用 prop 并且肯定有一个方法可以直接改变 prop editing。

他们说你应该使用从 prop editing 派生的 computed 值，并改变 computed 值。

另外，当你想改变propediting的值时，你应该emit一个事件，让父组件监听它，然后改变editing的值。 editing的值改变后，子组件会自动反映变化。