vue项目中经常会遇到提交图片的事件,提交图片有两种方式,一个是通过formdata表单格式提交,一种就是提交base64数据流,我更倾向于后者,今天给大家提供一份将图片转为base64的方法
/**
* 将图片转换成base64格式
* @param img 图片文件
* author: Jacky
*/
export function getBase64 (img, callback) {
const reader = new FileReader()
reader.addEventListener('load', () => callback(reader.result))
reader.readAsDataURL(img)
}
export default {
install (Vue, options) {
Vue.prototype.$getBase64 = getBase64 // 挂载方法
Vue.prototype.$log = function (...arg) {
if (process.env.NODE_ENV !== 'production') {
console.log(...arg)
}
}
}
}
这个方法可以修改后直接应用在模板里,我这里是直接封装成公共方法了,以上代码是放在公共js文件里的,然后在main.js中引入并使用就可以了
import commonPlugins from './utils/plugins'
Vue.use(commonPlugins)
以上就完成了对该方法的封装,需要的小伙伴们可以去封装啦!