Vue学习
Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架。与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用。Vue 的核心库只关注视图层,不仅易于上手,还便于与第三方库或既有项目整合。另一方面,当与现代化的工具链以及各种支持类库结合使用时,Vue 也完全能够为复杂的单页应用提供驱动。
插值
a.文本
b.纯html
v-html 防止xss攻击
c.表达式
指令:带有v-前缀
v-bind
v-if
v-on:click
v-model:
-双向数据绑定
缩写
v-bind:src => :src
v-on:click => @click
计算属性-复杂逻辑:computed
-计算属性时基于他们的依赖进行缓存的。
-计算属性只有在它的相关依赖才会重新请求
class与style绑定
绑定html class
-对象语法
<p class="default" :class="{active:isShow,show:isShow2}">class样式</p>
-数组语法
<p class="default" :class="[who,'show']">class样式</p>
绑定内联样式
-对象语法
<p class="default" :style="{background:color}">class样式</p>
-数组语法
条件渲染
v-if
v-else
template v-if:template不会渲染到dom节点
v-show:v-show不支持template和v-else
#列表渲染
v-for
a.in
b.of
key
-跟踪每个节点的身份,从而重用和重新排序
-理想的key值时每项都有且唯一的id
数组更新检测
a.使用以下方式操作数组,可以检测更新
push() pop() shift() unshift() splice() sort() reverse()