vue.js特殊使用方法

 

1.输入框里键盘对应按键事件----直接用 @keyup.enter="可直接写function事件(也可写不带小括号的方法名)"

　　<input type="text"

　　　　@keyup.enter="alert('按下了回车')"

　　　　@keyup.space="alert('按下了空格')"

　　　　@click="alert('单击')"/>

2.用v-model来进行双向绑定，一般会把input的value值与页面其他文本的内容进行绑定，方便动态实现例如“字数统计”，“内容实施变化”等操作；

　　获取radio的值           <input type="radio" v-model="radio" value="1" id="one"><label for="one">1</label>

　　获取checkbox的值    <input type="checkbox" v-model="checkbox1"  :true-value="1" id="checkbox1" >

       获取“复选框“的value值---默认获取的是true和false，所以需要用v-bine的方法来获取   :true-value="1"   (v-bind可以省略)--------不推荐使用，因为只能获取“数字”，在一个CheckBox的情况下获取的是true和false，多个时需要在data里用checkbox1：[]绑定才是对应的value值

　 获取多选框select 的值 　   　　

　　 <p>多选框：<select id="select" v-model="select">
   　　　　　　　　　　　　 <option value="1">1</option>
    　　　　　　　　　　　　<option value="2">2</option>
    　　　　　　　　　　　　<option value="3">3</option>
    　　　　　　　　　　　　<option value="4">4</option>
  　　　　　　　　　     </select>

4.碰到延时加载时会发现页面会显示“{{ }}”这种内容，如不想出现，可以使用如下标签

 　　定义[v-cloak]的style

• <style>
• [v-cloak] {
• display: none;
• }
• </style>

  使用了Mustache标签的地方加上v-cloak----------<div v-cloak>{{ message }}</div>

   

  这样“{{ }}”这个就不会出现