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>
标签中。