vue获取后端数据并显示

要在Vue中获取后端数据并显示，可以使用Vue的内置HTTP库或第三方库，如axios或fetch。

首先，您需要发送一个HTTP请求到后端API以获取数据。在Vue中，您可以使用以下示例代码：

import axios from 'axios';

export default {
  data() {
    return {
      posts: []
    }
  },
  mounted() {
    axios.get('/api/posts')
      .then(response => {
        this.posts = response.data;
      })
      .catch(error => {
        console.log(error);
      });
  }
}

上面的代码在组件加载时发送一个GET请求到“/api/posts”端点，然后将响应数据存储在组件的“posts”属性中。您可以将其用于在模板中显示数据：

<template>
  <div>
    <ul>
      <li v-for="post in posts" :key="post.id">
        {{ post.title }}
      </li>
    </ul>
  </div>
</template>

在上面的示例中，“v-for”指令将遍历“posts”数组并为每个项目呈现一个列表项。您可以使用类似的方法来显示从后端API获取的其他数据。