VUE的语法笔记

时间:2022-09-25 05:32:31
v-model = 'content' {{contents}} //vue 双向视图的绑定
v-text 只能返回一个文本内容
v-html 不仅可以返回文本内容还可以返回html标签
v-for item ,index in items :key='index'
//vue的for循环时,必须绑定一个:key的属性 不然会有一个警告 并且也会提升渲染性能。
需要注意的是 key的值不能相同,所有如果在遇到如数组的情况下 ,我们可以使用index去暂时代替。建议并希望这样做。
v-bind 可以缩写成 :
v-on 可以缩写成@一个事件名
v-once 表示改事件只执行一次。后面都会无效
v-show 可以动态的让元素消失或者隐藏 但是不会让元素移除 可以传参数$event
v-if v-else v-else-if 也可让元素消失或者隐藏 但是他会直接让这个元素直接移除。
在使用双向绑定的时候。我们需要在data内进行一个占位操作。即设置一个需要解析的属性名称。
//===
methods 在vue中是用来写逻辑方法的
computed 在vue中是用来计算属性的。
watch:是用来监听某个元素或者属性的变化的。
v-bind:class="{ active: isActive }" 可以缩写成 :class="{ active: isActive }";
v-bind:style="{ color: activeColor, fontSize: fontSize + 'px'
可以缩写成以下的方式 :style="{ color: activeColor, fontSize: fontSize + 'px'
 vm.$mount(); //代表挂载属性 vm.$destroy()//代表销毁属性
delimiters:[] 用来修改默认的模板解析符号

移动端阻止事件冒泡 $event.cancelBubble=true;  @click.stop='' 阻止冒泡

ev.preventDeafult();   @contextmenu.prevent 阻止右键菜单

key.enter或者key.13 keyup.up或者left right down delete 等快捷键

注意,v-show 不支持 <template> 元素,也不支持 v-else