vue给input框属性赋值的方法
在Vue中,可以使用v-model
指令实现双向数据绑定,让输入框的值与组件的数据属性保持同步。这里是一个简单的例子
- 创建一个Vue实例:
const app = new Vue({
el: '#app',
data: {
inputValue: ''
}
});
- 在页面中使用**
v-model
指令:**
<div id="app">
<input type="text" v-model="inputValue" />
<p>输入框的值:{{ inputValue }}</p>
</div>
在这个例子中,我们创建了一个Vue实例,并在data
属性中定义了一个名为inputValue
的变量。然后,在HTML中使用v-model
指令将inputValue
与输入框的值进行了双向绑定。现在,当用户在输入框中输入内容时,inputValue
会自动更新,同时显示在<p>
标签中。