我有一些组件看起来像这样。
<template>
<q-layout>
<v-input v-model="something" />
</q-layout>
</template>
<script>
import { QLayout } from 'quasar'
import { Input } from 'vedana'
export default {
name: 'index',
components: {
QLayout,
Input
},
data () {
return {
something: ''
}
}
}
该v输入分量如下所示:
<template>
<input
:type="type ? type : 'text'"
class="v-input"/>
</template>
<script>
export default {
props: ['type'],
name: 'v-input'
}
</script>
当我把数据输入到输入中时,something
不会绑定到v-input内部的输入值中的任何内容。
我该如何做到这一点?
2条答案
按热度按时间epggiuax1#
若要启用
v-model
的使用,内部元件必须接受value
属性。使用
:value
而不是v-model
将value
绑定到内部的<input>
(这将使来自父对象的属性发生变化)。当内部的<input>
被编辑时,为父对象发出input
事件,以更新其值(input
事件将更新父对象在v-model
上的变量)。此外,如果您有
type
属性的预设值,请在props
中宣告它,而不要在样板中宣告。代码应该是这样的
有关
props
可以具有的内容的信息:组件/使用属性传递数据。演示如下。
第一次
ukdjmx9f2#
https://v2.vuejs.org/v2/guide/components.html#sync-Modifier
您需要使用
.sync
修饰符将值传递给输入组件,以便更改将同步回父组件。