Question

大家好，我试图让v-model处理已创建的自定义组件时遇到一些问题。问题是这个组件包含两个输入，每次更改这些组件时，我会发出"input"事件并将其绑定到父项上的数组。

<key-value-input v-for="n in inputs" v-model="provider.params"></key-value-input>

然后在组件本身......

        updateData() {
            this.$emit('input', {
                key: this.inputData.key,
                value: this.inputData.value
            })
        }

这种方法可以解决的问题是它将原始空数组中的provider.params替换为仅包含多个键值组合之一的对象可能因为这个组件可以在运行时重复...

所以问题是，我该如何制作它以便v-model可以从每个子组件中获取数据并简单地将其设置为父级数组中的对象？

Answer 1

如果我理解正确，您只需在数组元素本身上使用v-model：

<key-value-input v-for="n in inputs" v-model="provider.params[n-1]"></key-value-input>

这是JSFiddle：https://jsfiddle.net/2be4maxm/

Vue JS自定义组件v-model

1 个答案: