-
v-show 使用 css display属性 开销小 频繁切换使用 v-if 删除节点重新渲染 开销大 不频繁切换使用 组合使用 v-if v-else-if v-else 获取 $event @click="test1($event) test1(evt){ console.log(evt); }, 阻止事件冒泡,并阻止默认事件行为 @click.stop.prevent="test4"
-
延迟显示 修饰符 lazy <input type="text" v-model.lazy="msg"> 强制类型转换 <input type="text" v-model.number="msg"> 清除空格 trim <input type="text" v-model.trim="msg"> 数据双向绑定 v-model="变量" 一般用于表单 change
<!-- 多选框 --> v-model可以代替checked的值
<input type="checkbox" value="小红" v-model="girl">小红
<input type="checkbox" value="小绿" v-model="girl">小绿
-
全局过滤器
<li v-for="item in arr">{ { item.say|subStr(4,item.name)}}</li> Vue.filter("subStr", function (val,length,name) { return }第一个参数默认就是 |管道符前面的值value
-
生命周期钩子函数
生命周期是一个Vue实例从创建到销毁的一个完整过程
可以在生命周期里面做 ajax请求,获取dom节点,操作数据
前面四个 是
1. beforeCreate(){ console.log("Vue实例初始化"); 2. created(){ console.log("Vue实例化完成,但是没有渲染视图,数据已经渲染完成"); 3. beforeMount(){ console.log("视图模板编译之前"); 4. mounted(){ console.log("视图模板变异完成,并渲染视图");
beforeUpdate(){<