事件.prevent 阻止默认事件
事件.stop 阻止事件冒泡
事件.capture 捕获冒泡 影响冒泡事件的执行顺序
事件.self 事件只有触发在自己身上才起效
事件.once 只执行一次事件
v-model双向绑定
1.其实就是跟表单元素的value绑定
2.单选多选 也是跟value绑定 v-mode=“” 与value值相等才选中
3.菜单写在select标签里 也是跟value绑定 v-mode=“” 与option选项value值相表示选中对应的option
<div id="box">
<input type="text" v-model="con" >
<h2>{{con}}</h2>
<textarea name="" id="" cols="30" rows="10" v-model="con"></textarea>
<hr>
多选框:<input type="checkbox" v-model="flg">
<h2>{{ flg }}</h2><hr>
吃饭 <input type="checkbox" v-model="zt" value="吃饭">
睡觉 <input type="checkbox" v-model="zt" value="睡觉">
打豆豆 <input type="checkbox" v-model="zt" value="打豆豆">
<h2> {{zt}} </h2><hr>
单选:<input type="radio" v-model="isradio" value="是">是
<input type="radio" v-model="isradio" value="否">否
{{isradio}} <hr>
<select name="" id="" v-model="select">
<option >请选择</option>
<option >前端</option>
<option >java</option>
<option >ui</option>
<option >测试</option>
</select>
{{ select }}
</div>
<script>
new Vue({
el:"#box",
data:{
con:"",
flg:true,
zt:[],
isradio:"是",
select:"请选择"
},
})
</script>