vue指令-->v-pre,v-cloak,v-once,v-html,v-text,v-if

v-pre 解除编译{{}}显示text文本 
v-cloak 开始加载页面的时候页面会闪现出{{}}用这个配合css祛除, 
v-once 显示首次加载过来的data数据无法更改视图 
v-html === innerHTML,吧data中的html字符串数据显示在页面 要注意xss攻击
v-text === innertext
v-if 通过判断data数据中的布尔值来决定绑定v-if元素的显示与,<template>标签vue专门提供给vue用来v-if判断 
的此标签不会渲染到页面里
7,v-else 
8,v-else-if 
9,v-show 控制着元素的display:值 v-if是完全的移除一个元素 不支持<template>
10,v-bind 绑定元素属性 简写':' 
11,:class="[ceshiclass,blueclass]" 都是data中的数值取过来添加类无法判断布尔值来添加元素
12,:class="{red:flag}" 前者是类名,后者判断是不是布尔值true添加false不添加
13,:style="[color,color1]"多个data中的对象{}用数组表示 数组中写样式注意小驼峰式写法v-bind:style的权重 
大于原生自带的style
14,v-on vue中绑定事件的插值表达式
v-on:click="change('red')"  传入一个值对应 methods里的change(color1)
15,v-for="(item,index) in arr"遍历数组 第一个item表示遍历循环数组中的每一项,第二个index表示索引,也 
可以单独写一个item 用脚手架搭建的vue要有唯一的key值后台给前端数据一般每条数据会给出一个ID,这个ID作为 
key值比较合适,因为key值改变对性能优化不好,要重新渲染一次dom,vue底层对改变原始做了一次优化没有改变 
key的情况下可以复用
 <div v-for="(key,value) in peraon">{{ key }}</div> 遍历一个对象
 <div v-for="item in 100">{{ item }}</div> 遍历数字1-100 
 <div v-for="item in '100'">{{ item }}</div> 遍历字符串中的每一位
遍历多个元素用<template>元素下面套多个子元素,注意template不能写key属性,必须要真实的元素使用key属性 
用模板字符串解决以下问题
    <template v-for="(key,value) in peraon">
        <div :key="`${value}_1`" :_key="`${value}_1`">{{key}}</div>
        <span :key="`${value}_2`" :_key="`${value}_2`">{{value}}</span>
    </template> 
 16,v-model双向数据绑定
 17,v-model.lazy model的修饰符,
 18,v-model.number model的修饰符改变数据双向绑定的类型
 19,v-model.trim 取消两边的空格
vue

我来吐槽

*

*