我对 Vue js 非常陌生，现在我尝试通过 ajax 调用获取表中的所有用户。我得到的用户没有任何问题，但是当我尝试使用新数据设置 data.user 时，我收到一条错误，指出属性或方法用户未定义。
这是我的用户列表组件：
<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">
<td>user.name</td>
<td>user.lastaname</td>
<td>user.email</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data: function () {
return {
users: []
}
},
mounted() {
axios.get('/users')
.then(function (response) {
console.log(response.data);
})
.catch(function (error) {
console.log(error.message);
});
},
}
</script>
Try this
<script>
export default {
data: function () {
return {
users: []
}
},
methods: {
getUsers: function() {
var app = this;
axios.get('/users')
.then(function (response) {
app.users = response.data;
})
.catch(function (error) {
console.log(error.message);
});
}
},
created() {
this.getUsers();
},
}
ES6 语法
getUsers() {
axios.get('/users')
.then((response) => this.users = response.data)
.catch((error) => console.log(error.message))
}
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
