vue.js将图片base64转图片

以下是使用vue.js将图片转为Base64并预览的实现方法：

1. 在Vue组件中添加一个input标签，用于选择图片文件：

<template>
  <div>
    <input type="file" ref="fileInput" @change="handleFileChange">
    <img :src="imgSrc" alt="预览图片">
  </div>
</template>

2. 在Vue组件的methods中添加一个处理文件变化的方法handleFileChange，该方法将选择的图片文件转为Base64编码并预览：

methods: {
  handleFileChange() {
    const file = this.$refs.fileInput.files[0]
    const reader = new FileReader()
    reader.readAsDataURL(file)
    reader.onload = () => {
      this.imgSrc = reader.result
    }
  }
}

3. 在Vue组件的data中添加一个imgSrc属性，用于存储Base64编码后的图片数据：

data() {
  return {
    imgSrc: ''
  }
}

4. 最后，可以在Vue组件的样式中设置预览图片的宽度和高度：

img {
  width: 200px;
  height: 200px;
}