知识回顾~这知识它不进脑子啊

持续创作，加速成长！这是我参与「掘金日新计划 · 6 月更文挑战」的第10天，点击查看活动详情

图片转化格式

img标签的src支持base64格式和图片地址(blob二进制) 的方式赋值

1.浏览器有一个内置处理图片的API ---url可以转图片格式为blob获取到图片地址

const url = URL.createObjectURL(图片文件)

url可以得到一个图片地址.

// 图片预览--浏览器有一个内置处理图片的API ---url可以转图片格式为blob获取到图片地址
        const url = URL.createObjectURL(files[0])
        // 赋给img标签的src属性
        this.$refs.imgRef.src = url
        //如果要给图片赋值为默认的路径不能直接赋值为路径
        可以将图片作为模块导入,再付给src

2.图片转base64格式

        // new FileReader()文件读取器
        const reader = new FileReader()
        // console.log(reader) //readAsDataURL图片转数据路径函数
        reader.readAsDataURL(e.target.files[0])
        // 数据读取完毕后触发这个回调
        reader.onload = () => {
        //   console.log(reader.result)
          //   把转化格式后的值赋给avatar存起来
          this.avatar = reader.result
        //   console.log(this.avatar)

跨域的解决方案

1.jsonp 缺点:只发送get请求 不能发送post请求

原理: 动态的创建script标签,添加src属性(但是这个请求是异步的),需要我们在页面声明一个函数,后端(服务器端)调用,把数据作为函数返 回给我们。

2.cors

原理:在响应头中添加 Access-Control-Allow-Origin:*

3.反向代理

原理: 服务器与服务器之间不存在跨域,可以相互同信

在vue.config.js中做以下配置

devServer:{
proxy: {
      /* 它会自动匹配路径中是否包含api,包含走target,它会把axios的本地路径偷偷替换成目标路径
          http://localhost:8888/api/sys/login  => http://ihrm-java.itheima.net/api/sys/login
​
                                     不包含api的话,它会走pathRewrite,用''空字符串替换/api
                                     =>http://ihrm-java.itheima.net/sys/login
      */
      // '/api': {
      //   // 目标路径,
      //   target: 'http://ihrm-java.itheima.net',
      //   // 路径重写
      //   pathRewrite: {
      //     '^/api': ''
      //   }
      // }
  }

组件之间传值

子向父传值 1.自定义事件 2.this.$parent

父向子传值 1.自定义属性 2.this.$children

注意第2种方式传值,要注意嵌套关系

变量的生命周期

1.全局变量的生命周期:

生:页面加载时,死:页面关闭时

2.局部变量的生命周期:

生:函数调用时,死函数调用完毕时

3.怎么改变局部变量的生命周期

function fn(){
 let b=20
    retrun function (){
        return b
    }
}

补充知识好辛苦,呜呜呜~~~