Vuetify 自定义 v-text-field 组件未更新 v-model

Question

我正在关注此文档：https://vuejs.org/v2/guide/components.html 我创建了如下所示的自定义 v-text-field 组件：

<template>
<div>
<v-text-field
        :label="label"
        v-bind:value="value"
        v-on:input="$emit('input', $event.target.value)"></v-text-field>
</div>
</template>

<script>
export default {
    name: "txtbox",
    props: ['value', 'label'],
}
</script>

我几乎成功地在我的主要组件中实现了它：

<txtbox
label="Name"
v-model="eventName"
/>

我认为没有必要粘贴所有代码，但如果是我会编辑 post。下面是它的工作原理：我有一个列表，当我单击列表元素时，文本字段显示它的内容，这很好用。遗憾的是，当我编辑文本字段的内容时，v-model 值没有更新。我还可以补充说，它可以正常工作（如在文档中）而不是 .有什么我可以做的让它工作，还是我应该使用简单的输入？谢谢

Answer 1

当你想要 $emit 新值时，你只需要发出 $event，而不是 $event.target.value

<template>
<div>
    <v-text-field
        :label="label"
        v-bind:value="value"
        v-on:input="$emit('input', $event)"></v-text-field>
</div>
</template>

v-on:input 也可以缩短为 @input

Vuetify 自定义 v-text-field 组件未更新 v-model

Vuetify custom v-text-field component is not updating the v-model

vue.js

vue-component

vuetify.js

v-model