首页 > 其他 > 详细

vue基础八

时间:2017-01-12 18:51:34      阅读:29      评论:0      收藏:0      [点我收藏+]

标签:tag   控件绑定   用户   tip   ssa   multipl   双向   负责   选择列   

表单控件绑定

1.基础用法

你可以用 v-model 指令在表单控件元素上创建双向数据绑定。尽管有些神奇,但 v-model 本质上不过是语法糖,它负责监听用户的输入事件以更新数据,并特别处理一些极端的例子。

1.1文本

<input v-model="message" placeholder="edit me">
<p>Message is: {{ message }}</p>
1.2复选框
单个勾选框,逻辑值:
<input type="checkbox" id="checkbox" v-model="checked">
<label for="checkbox">{{ checked }}</label>
1.3单选按钮
<input type="radio" id="one" value="One" v-model="picked">
<label for="one">One</label>
<br>
<input type="radio" id="two" value="Two" v-model="picked">
<label for="two">Two</label>
<br>
<span>Picked: {{ picked }}</span>
1.4选择列表
单选列表:
<select v-model="selected">
<option>A</option>
<option>B</option>
<option>C</option>
</select>
<span>Selected: {{ selected }}</span>
多选列表(绑定到一个数组):
<select v-model="selected" multiple>
<option>A</option>
<option>B</option>
<option>C</option>
</select>
<br>
<span>Selected: {{ selected }}</span>
 

vue基础八

标签:tag   控件绑定   用户   tip   ssa   multipl   双向   负责   选择列   

原文:http://www.cnblogs.com/xj198197/p/6279142.html

(0)
(0)
   
举报
评论 一句话评论(0
0条  
登录后才能评论!
© 2014 bubuko.com 版权所有 鲁ICP备09046678号-4
打开技术之扣,分享程序人生!
             

鲁公网安备 37021202000002号