Vue第三章 自定义指令、axios、网络请求、v-if（附带详细代码）

目录

一、自定义指令

二、axios

三、网络请求

四、v-if

 每日一句

一、自定义指令

1. 自定义指令: 用户可以制作自己的指令
2.  directive: 指令
3.  指令必须是 v- 开头
4. v-blue: v- 是标识;  blue 是指令名

5. v-color="'orange'"> 
   color(el, bindings) {
         // 参数1: DOM元素
         // 参数2: 指令携带的信息, 包括名称和值 等...
         console.log(arguments)
         el.style.color = bindings.value
       }

6. 自定义指令的高级用法
   1. 系统的autofocus属性, 可以让元素自动获得焦点 
   2. 自制 v-focus 指令, 实现相同的操作
   3. 指令的精确配置模式:  指令名:{配置项...}
   4. 错误示例

      focus(el) {
          //   // focus(): 元素自带的方法, 调用后会获得焦点
          //   el.focus()
          // },
      	此写法: 默认是在DOM元素 内存创建阶段触发的, 获取焦点会失败

   5. 正确写法

      focus: {
            // inserted:嵌入;  指令所在的元素 嵌入到 页面中展示出来
            // DOM元素的生命周期: 内存中创建->渲染到页面->更新->销毁
            // 让元素获