gpt4 book ai didi

node.js - 如何使用VueJs和Axios显示表中的所有用户?

转载 作者:太空宇宙 更新时间:2023-11-03 23:14:57 24 4
gpt4 key购买 nike

我正在尝试将数据库(MYSQL)中的用户显示到 vueJs 中的表中。在下面的代码中,我尝试在表中显示用户,但它什么也没显示。另外,当我访问 console.log 时,我可以看到

  • 数组(4) 0: {…} 1: {…} 2: {…} 3: {…}

每次我点击 0: {…} 时,我都会看到我的 JSON。我应该怎样做才能在我的表格中显示此代码。

<template>
<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-default">
<div class="panel-heading">List of users</div>
<div class="panel-body">
<table class="table">
<thead>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<tr v-for="user in users" :key="user.id">
<td>user.url</td>
<td>user.lastaname</td>
<td>user.email</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>

在脚本中

<script>
import QrcodeVue from "qrcode.vue";
import axios from "axios";

export default {
data() {
return {

users: [],

};
},
methods: {
getUsers() {
axios
.get("localhost:2000/user/")
.then(response => (this.users = response.data))
.catch(error => console.log(error.message));

},
components: {
QrcodeVue
},
mounted() {
axios
.get("localhost:2000/user/")
.then(response => {
this.results = response.data[1];
console.log(this.results);
})
.catch(err => {
throw err;
});
}
};
</script>

感谢您的帮助!

附注

我试图遵循这个code StackOverflow 中也有人提出这个问题。

编辑:这是输出 now

最佳答案

你忘记了大括号!

这是它的代码:

<div class="container">
<div class="row">
<div class="col-md-8 col-md-offset-2">
<div class="panel panel-default">
<div class="panel-heading">List of users</div>
<div class="panel-body">
<table class="table">
<thead>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Email</th>
</tr>
</thead>
<tbody>
<tr v-for="user in users" :key="user.id">
<td>{{ user.url }}</td>
<td>{{ user.lastname }}</td>
<td>{{ user.email }}</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>

关于node.js - 如何使用VueJs和Axios显示表中的所有用户?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/56681896/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com