vue从后端拿图片地址显示在前端

在Vue中从后端获取图片地址并显示在前端可以通过以下步骤实现：

1. 在Vue组件中定义一个data属性来存储后端返回的图片地址，例如：

<template>
  <div>
    <img :src="imageUrl" alt="图片">
  </div>
</template>

<script>
export default {
  data() {
    return {
      imageUrl: ''
    }
  },
  methods: {
    getImage() {
      // 在这里发送请求到后端获取图片地址
      // 假设返回的数据格式为{imageUrl: 'http://example.com/image.jpg'}
      axios.get('/api/getImage').then(response => {
        this.imageUrl = response.data.imageUrl
      })
    }
  },
  mounted() {
    this.getImage()
  }
}
</script>

2. 在Vue组件中使用`<img>`标签来显示图片，通过`:src`绑定`imageUrl`属性来动态更新图片地址。

3. 在Vue组件的`mounted`生命周期钩子函数中调用`getImage`方法来发送请求获取图片地址并更新`imageUrl`属性。

注意：在上述代码中，我使用了axios库来发送请求。如果你使用其他库或者原生的XMLHttpRequest对象发送请求，代码实现方式可能会有所不同。