axios获取图片后，如何渲染到页面上？

axios获取图片后，如何渲染到页面上？

场景

由于某些图片，在获取的时候需要带上token之类的身份验证参数，所以没法直接将图片地址绑定在img标签的src上获取图片。

解决

获取并处理：

this.axios.get(url, { responseType: 'blob' }).then(res => {
	const reader = new FileReader();
	reader.onload = (e) => {
		this.imgUrl = e.target.result;
	};
	reader.readAsDataURL(res);
});

使用：

<img :src="imgUrl "/>

思路

img标签的src属性可以接收base64编码。
所以这里用FileReader读取blod，用readAsDataURL方法将读取到的blod生成一个URL格式的字符串（base64编码）。