VUE笔记

1、VUE基础
    1、JAVASCRIPT框架；
    2、简化DOM操作；
    3、响应式数据驱动；
【https://vuejs.bootcss.com/】

（1）第一个VUE程序；
（2）el:挂载点；
    作用范围，被选中的元素及内部的后代元素；
    通常建议使用ID选择器
    可以使用双标签，单标签不行；
    不能挂载在body或者html标签上；
（3）data:数据对象；
    VUE中用到的数据定义在data中；
    data中可以写复杂类型的数据；
    渲染复杂类型数据时的，遵守js的语法即可；

2、本地应用
    VUE指令：
    v-text/v-html/v-on/v-show/v-if/v-bind/v-for/v-on/v-model
v-text:
    设置标签的文本值（textContent）
    <h2 v-text="message"></h2>//全部被替换
    <h2>深圳{{message}}</h2>//只是message被替换；
v-html:
    设置标签的innerHTML
    <p v-html="content"></p>
v-on
    为元素绑定事件；
    <input type="button" value="事件绑定" v-on:事件名="方法">
    如：<input type="button" value="事件绑定" v-on:click="dolt">
    (1)v-on指令的作用是：为元素绑定事件；
    （2）事件名不需要写on
    （3）指令可以简写为：@
    （4）绑定的方法定义在methods属性中；
    （5）方法内部通过this关键字可以访问定义在data中数据；    
    JS的Vue里面，增加methods:{dolt:function(){}}
v_show
    根据表达值的真假切换无素的显示和隐藏；
    （1）v-show指令的作用是：根据真假的切换元素的显示状态；
    （2）原理是修改元素的display，实现显示隐藏；    
    （3）指令后面的内容，最终都会解析为布尔值；
    （4）值为true元素显示，值为false元素隐藏；
    （5）数据改变之后，对应元素的显示状态会同步更新；
v-if
    根据表达值的真假，切换元素的显示和隐藏（操纵DOM元素）
    （1）v-if指令的作用是：根据表达式的真假切换元素的显示状态；
    （2）配制是通过操作dom元素来切换显示状态；
    （3）表达式的值为true，元素存在于dom树中，为false,从dom树中移除；
v-bind
    设置元素的属性（比如：src,title,class）
    表达式：v-bind:属性名=表达式；
    <img v-bind:src="imgSrc">//在js的data里放入:imgSrc就可以了；
    （1）v-bind指令的作用是：为元素绑定属性；
    （2）完整写法是v-bind:属性名；
    （3）简写的话可以直接省略v-bind，只保留:属性名；
v-for
    根据数据生成列表结构
    <v-for="(item,index) in arr">//item为js里的数组数据；
    <v-for="(item,index) in objArr">//item为js里的对象；
    （1）v-for指令的作用是：根据数据生成列表结构；
    （2）数组经常和v-for结合使用；
    （3）语法(item,index)in 数据；//item为js里的数组；
    （4）item和index可以结合其他指令一起使用；
    （5）数组长度的更新会同步到页面上，是响应式的；
v-on
    传递自定义参数，事件修饰符
    <input type="button" @click="dolt(参数列表)">
    <input type="button" @keyup.enter="sayHi">
    （1）事件绑定的方法写成函数调用的形式，可以传入自定义参数；
    （2）定义方法时需要定义形参来接收来接收传入的实参；
    （3）事件的后面跟上.修饰符可以对事件进行限制；
    （4）.enter可以限制触发的按键为回车；
v-model
    获取和设置表单元素的值（双向数据绑定）；
    <input type="text" v-model="message">//message为js
    （1）v-model指令的作用是便捷的设置和获取表单元素的值；
    （2）绑定的数据会和表单元素值相关联；
    （3）绑定的数据（双向改变）表单元素的值；
3、网络应用
axios(网络请求库+vue)
    功能强大的网络请求库；
    （1）
4、综合应用