jj.*_*eyn 5 vue.js vue-component vuetify.js v-model
我正在关注此文档: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>
Run Code Online (Sandbox Code Playgroud)
我几乎成功地在我的主要组件中实现了它:
<txtbox
label="Name"
v-model="eventName"
/>
Run Code Online (Sandbox Code Playgroud)
我认为没有必要粘贴所有代码,但如果是,我会编辑帖子。这是它的工作原理:我有一个列表,当我单击列表元素时,文本字段会显示它的内容,这很好用。遗憾的是,当我编辑文本字段的内容时,v-model 值没有更新。我还可以补充一点,它适用于普通(如文档中)而不是 . 有什么我可以做的让它工作,还是应该使用简单的输入?谢谢
Dji*_*jip 12
当您想要$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>
Run Code Online (Sandbox Code Playgroud)
v-on:input 也可以缩短为 @input
| 归档时间: |
|
| 查看次数: |
5345 次 |
| 最近记录: |