【vue学习】 初时vue

1.1 基础认识

---

• v-model 双向绑定 主要应用在 input 中
• v-bind 绑定，例如： style class href src 等等，只要绑定了，就可以访问 data里面的值了，（可以暂且那么理解），可以使用三目运算

:class={active:i % 2==0} //如果等于true那么这个类应用上
:style={color:(i % 2 ==0? 'red','black' )}
:href="`detail.html?id=${item.id}`"

v-for 循环，主要是主要需要 :key='index'，具体语法

<li v-for='(item,i) in arr' :key="item">{{ item }}</li>

还有几个修饰符， .trim .number .lazy（文本框失去焦点，触发）

1.2 常用的指令

---

1. v-show 控制显示或者隐藏 传入的Boolean
2. v-if 建议不使用，因为比较消耗内存
3. @ 也就是 v-on 触发 修饰符 .once 只能触发一次，补充@keydown 触发 e.keycode 就是按下什么键才触发事件，事件在vue中是 methods，也还可以 @keydown.13（enter） 就是帮你判断是不是按下了 回车键
4. v-once 表示 只加载一次

1.3 冷门指令，自定义指令

---

Vue.directive('red', (el,data) =>{
            el.style.color = 'red'
        })

el为 绑定的元素，自定义指令

普及一个

指令 v-cloak 表示等待vue加载完在显示

需要在css中 添加 [v-cloak]{display:none}