vue学习笔记9-监听属性-watch
常用，只要是输入基本上离不开它。
<input type="text" v-model="name"/>
{{name}}
data : {
name : ''
}这样就可以实现绑定 而且他后面也有很多功能，比如.lazy，惰性更新，只有焦点离开才会更新
<input type="text" v-model.lazy="name"/>.trim去掉所有空格
但model不止是用来绑定输入框的，它是用来绑定表单的，自然能绑定其他属性，复选框，单选框，列表等 单选框：
<input type="radio" name="" id="" value="百度" v-model="rck"/>百度<br />
<input type="radio" name="" id="" value="阿里" v-model="rck"/>阿里<br />
<input type="radio" name="" id="" value="腾讯" v-model="rck"/>腾讯<br />
选择的是——{{rck}}
data : {
rck : '',
}因为是双向选择，所以如果把rck的默认值改成百度，那刚进入页面的时候就会默认选中百度。
复选：
<input type="checkbox" name="" id="" value="男" v-model="love" />男<br />
<input type="checkbox" name="" id="" value="女" v-model="love" />女<br />
<input type="checkbox" name="" id="" value="扶她" v-model="love" />扶她<br />
<input type="checkbox" name="" id="" value="伪娘" v-model="love" />伪娘<br />
你的性取向是——{{love}}
data : {
love : [],
}同理，在love里面填value也会默认选中，但love是个数组而rck是个字符串
列表：
<select v-model="sel" name="">
<option value="">选择你的性别</option>
<option value="男">男</option>
<option value="女">女</option>
<option value="扶她">扶她</option>
<option value="伪娘">伪娘</option>
</select><br />
你的性别是——{{sel}}
data : {
sel : '',
}本文参与 腾讯云自媒体分享计划，分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读