标签:有用 entity 双向 rip line uri 指令 teacher checkbox
1、v-else 必须跟着v-if 或者 v-show 一起使用 ,充当else的作用。
<div id="example"> <p v-if="ok">男人</p> <p v-else="ok">女人</p> </div>
<script>
new Vue({
el:"#example",
data:{
ok:ture
}
});
</script>
2、v-model 用来在input ,select , text, checkbox,radio等表单标签控件上创建双向数据绑定。
<form> 姓名:<input type="text" v-model="data.name" placeholder="" /><br /> 性别:<input type="radio" id="man" value="one" v-model="data.sex" /> <lable for="man">男</lable> <input type="radio" id="male" value="two" v-model="data.sex" /> <lable for="male">女</lable> <input type="radio" id="noman" value="three" v-model="data.sex" /> <lable for="noman">隐私</lable><br /> 兴趣:<input type="checkbox" id ="book" value="book" v-model="data.interest" /> <label for="book">阅读</label> <input type="checkbox" id ="swim" value="swim" v-model="data.interest" /> <label for="swim">游泳</label> <input type="checkbox" id ="game" value="game" v-model="data.interest" /> <label for="game">游戏</label> <input type="checkbox" id ="song" value="song" v-model="data.interest" /> <label for="song">唱歌</label><br /> 身份:<select v-model="data.identity"> <option value="teacher">教师</option> <option value="doctor">医生</option> <option value="lawyer">律师</option> </select>
</form>
<script>
new Vue({
el:"#example",
data:{
data:{
name:"1",
sex:"one",
interest:["book","song"],
identity:"teacher"
}
}
});
</script>
注意: 在表单控件赋默认值的时候,如果你想这样:<input type="checkbox" id ="book" value="book" v-model="data.interest" selected/>
那么你在data.interest中也必须有“book”的值。html中标签的默认值必须在Vue模版中的默认值之中,因为在v-model进行的是双向的数据绑定。
3、v-model 可以添加多个参数:number、lazy、debounce
标签:有用 entity 双向 rip line uri 指令 teacher checkbox
原文地址:http://www.cnblogs.com/shannonliang/p/6087108.html