2020-10-12 表单输入绑定

最新推荐文章于 2024-09-21 11:34:18 发布

敲代码的凪辉机

最新推荐文章于 2024-09-21 11:34:18 发布

阅读量373

点赞数

文章标签： vue.js

本文链接：https://blog.csdn.net/qq_46580089/article/details/109024041

版权

本文详细介绍了Vue.js中表单输入绑定的基础用法，包括文本、多行文本、复选框、单选按钮和选择列表的示例。同时，讲解了如何绑定value，并通过修饰符如.lazy和.number来控制数据同步时机和转换输入类型，优化性能并确保数据正确性。

摘要由CSDN通过智能技术生成

文本

<div id="app">
	<form>
		<input v-model="msg" />
	</form>
</div>

var vm = new Vue({
   
				el:"#app",
				data: {
   
					msg:'hello world!'
				},
			});

效果：
在这里插入图片描述
多行文本

<div id="app">
			<form>
				<textarea name="" id="" cols="50" rows="20" v-model="msg"></textarea>
			</form>
		</div>

var vm = new Vue({
   
				el:"#app",
				data: {
   
					msg:'hello world!'
				},
			});

效果：
在这里插入图片描述
复选框

<div id="app">
			<form>
				爱好<input type="checkbox" />看电影
			</form>
		</div>
var vm = new Vue({
   
				el:"#app",
				data

关注