vue.js基础学习（1）

一：v-cloak：解决浏览器闪烁，编译过程中不会显示，直到编译结束才显示。

用法：[v-cloak] {
  display: none;
}

<div v-cloak>
  {{ message }}
</div>

二：v-on  事件绑定
methods:{
action:function(){console.log("action")},

action2(){console.log("action2")
e.stopPropagetion();  //js阻止事件冒泡,vue中使用stop事件修饰符
},
}

v-on：click='action（）'  或简写@click='action1（$event）'  没参数时可以省略括号，只写方法名

三：v-for 循环遍历

<div v-for="(item, index) in items"></div>
<div v-for="(val, key) in object"></div>
<div v-for="(val, key, index) in object"></div>

四：v-model绑定表单数据（<input>、<select>、<textarea>、components

.lazy - 取代 input 监听 change 事件

.number - 输入字符串转为有效的数字

.trim - 输入首尾空格过滤

五：过滤器（filter）可执行的函数,优先执行实例内部的过滤器
1.filters:{  //内部过滤器 在new实例的里面
number(date,n){data.toFixed(n)}
}或number:function(date,n){data.toFixed(n)}
}

用法：<div>{{3.1415926|number(2)}}</div>
2.外部过滤器
 vue.filter("name",function(data){
return data>11?data:“0”+data})

用法：<div>{{1|name}}</div>