vue从数据库中读取数据

要从数据库中读取数据，你需要先使用后端语言（如PHP、Python、Node.js等）编写一个API接口来连接数据库，并将数据以JSON格式返回给前端。然后在Vue中使用Vue Resource或Axios等HTTP库来调用API接口，获取数据并显示在页面上。

以下是一个简单的Vue组件，它使用Vue Resource来调用API接口获取数据并显示在一个表格中：

<template>
  <div>
    <table>
      <thead>
        <tr>
          <th>ID</th>
          <th>Name</th>
          <th>Email</th>
        </tr>
      </thead>
      <tbody>
        <tr v-for="user in users" :key="user.id">
          <td>{{ user.id }}</td>
          <td>{{ user.name }}</td>
          <td>{{ user.email }}</td>
        </tr>
      </tbody>
    </table>
  </div>
</template>

<script>
import VueResource from 'vue-resource';

export default {
  data() {
    return {
      users: []
    };
  },

  mounted() {
    this.getUsers();
  },

  methods: {
    getUsers() {
      this.$http.get('/api/users').then(response => {
        this.users = response.body;
      });
    }
  }
};
</script>

在这个例子中，我们使用Vue Resource来发起一个GET请求，获取用户数据。当组件挂载时，会自动调用`getUsers()`方法并更新`users`数组。然后在模板中使用`v-for`指令循环遍历`users`数组，渲染表格中的每一行数据。

当然，具体的API接口实现还需要根据你的具体需求来编写。你需要在后端编写一个路由来处理`/api/users`请求，并从数据库中获取数据并返回。