初学着入门Vue第一篇

一.什么是Vue

Vue是一套用于构建用户界面的渐进式框架

二.Vue的特点和优点

特点：1.是由尤雨溪所创造的，v2与v3两个版本

           2.结合了Angular的指令于React的组件，虚拟dom

           3.渐进式javascript框架

优点：1.是中文文档

           2.生态丰富（插件多）上手简单

           3.指令，组件，虚拟dom

三.如何导入Vue与实例化：

第一种：本地引入js文件<script src="./js/vue.js"></script>

第二种：通过链接引入js：<script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>

实例化操作比较简单，需要new一个Vue内部定义好使用范围（el：指定模板范围），只能在指定的范围内起作用，超出指定范围则无效，然后在data属性内部定义指定的数据

 四.Vue指令与模板

Vue的数据和模板产生联系主要是通过指令，指令是联系模板与Vue实例的桥梁Vue的指令就是v-开头的特殊属性，通过指令可以进行一些简单的操作，如下：

五.文本渲染指令

{{}}  v-text  v-html（会解析html文本||innerHTML）

六.条件渲染指令

v-show：隐藏元素以css的方式  display：none/display：block     频繁切换用v-show    少量切换用v-if

v-if：是通过dom操作实现隐藏

v-else，v-else-if

七.遍历

v-for：字符串，数字，列表，对象进行遍历

           <p v-for="(item,index) in list" v-key="item">{{index+1}}-{{item}}</p>

           item 遍历的元素（自定义的名称

           index 遍历的下标（键名）

           list 被遍历的数据

v-key：值必须是唯一

            伪类让Vue更好的优化渲染列表