Vue如何显示linux服务器的图片

要在Vue中显示Linux服务器上的图片，你可以使用以下步骤：

1. 在Vue项目中创建一个组件，用于显示图片。你可以使用`<img>`标签来显示图片。

2. 在Vue组件的数据中定义一个变量，用于存储图片的URL。

3. 在Vue组件的生命周期钩子函数中，通过发送HTTP请求从Linux服务器获取图片的URL。

4. 使用Vue的双向绑定将获取到的图片URL赋值给定义的变量。

5. 在模板中使用该变量作为`<img>`标签的`src`属性值，以显示图片。

下面是一个简单的示例代码：

<template>
  <div>
    <img :src="imageURL" alt="Server Image">
  </div>
</template>

<script>
export default {
  data() {
    return {
      imageURL: '' // 存储图片URL的变量
    }
  },
  mounted() {
    this.getImageFromServer(); // 在组件挂载后获取图片
  },
  methods: {
    getImageFromServer() {
      // 发送HTTP请求获取图片URL
      // 你可以使用Axios、Fetch或其他HTTP库来发送请求
      // 假设服务器返回的数据中有一个字段名为'imageURL'，存储了图片的URL
      // 这里以Axios为例
      axios.get('/api/getImageFromServer')
        .then(response => {
          this.imageURL = response.data.imageURL; // 将获取到的URL赋值给变量
        })
        .catch(error => {
          console.error(error);
        });
    }
  }
}
</script>

请注意，上述代码中的`/api/getImageFromServer`是一个示例URL，你需要根据你的服务器端设置进行相应的调整。

这样，当Vue组件加载后，它将发送请求到Linux服务器获取图片的URL，并将其显示在页面上。