vues实现将后端返回的文件流转为图片路径直接展示图片

要将后端返回的文件流转为图片路径直接展示图片，可以借助于HTML5的FileReader对象。具体实现步骤如下：

1. 在Vue组件中定义一个方法，用于将文件流转为图片路径：

methods: {
  // 将文件流转为图片路径
  getFileUrl(file) {
    return new Promise((resolve, reject) => {
      const reader = new FileReader()
      reader.onload = () => {
        resolve(reader.result)
      }
      reader.onerror = reject
      reader.readAsDataURL(file)
    })
  }
}

2. 在组件中定义一个变量，保存图片路径：

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

3. 在组件中定义一个上传文件的方法，将文件上传到后端并获取文件流：

methods: {
  // 上传文件
  async uploadFile(event) {
    const file = event.target.files[0]
    const formData = new FormData()
    formData.append('file', file)
    // 上传文件到后端
    const response = await axios.post('/api/upload', formData, {
      headers: {
        'Content-Type': 'multipart/form-data'
      }
    })
    // 将文件流转为图片路径并保存到imageUrl变量中
    this.imageUrl = await this.getFileUrl(response.data)
  }
}

4. 在模板中添加一个input元素，用于选择文件并触发上传事件：

<template>
  <div>
    <input type="file" @change="uploadFile">
    <img :src="imageUrl">
  </div>
</template>

这样，当用户选择文件后，文件将被上传到后端并获取文件流，然后将文件流转为图片路径并展示在页面中。需要注意的是，这里的上传地址和后端返回的文件流格式需要根据实际情况进行修改。