sách gpt4 ai đã đi

javascript - 来自 Axios GET 响应的 VueJs 中的数组为空 | VUEJS/Laravel

In lại 作者:行者123 更新时间:2023-12-03 00:43:19 28 4
mua khóa gpt4 Nike

我正在学习如何通过 udemy 类(class)制作单页应用程序,同时尝试做一个大学项目。问题是,在我的 Controller 中,我将数据库查询作为 json“alunos”发送到前端。现在,在 Vue 中,如果我只放置 axios.get 和 console.log(response) 我可以看到来自 db 的数据在那里,但是当我尝试将该数据推送到我的数组以便我可以在模板上显示时,它仍然存在空,控制台不返回错误。我正在到处寻找,但仍然无法让它工作。

AlunoComponent.vue 模板

AlunoComponent.vue 内部的逻辑

   
export default {

data(){

trở lại {

aluno:{
nome:'',
nascimento:'',
rga:'',
cpf:'',
rg:'',
instituicao:'',
campus:'',
curso:'',
semestre:''
},
//vetor pras infos
alunos:[],
uri: '/alunos'

}
},

methods:{

loadAlunos(){

axios
.get(this.uri)
.then(response=>{

//console.log(response.data)
this.alunos = response.data.alunos
}).catch(error => {
console.log(error)
});
}
},

mounted() {

this.loadAlunos();
console.log('Component mounted.')
}
}

有人可以帮助我吗?我还是个 vue js 初学者

1 Câu trả lời

您的表格模板看起来不正确。你想要这样的东西:



{{aluno.id}}
{{aluno.rga}}
{{aluno.nome}}
{{aluno.instituicao}}
{{aluno.campus}}
{{aluno.curso}}
{{aluno.semestre}}




nếu như alunos 中有 5 个元素,当前模板将生成如下内容:



1
1
1
1
1
{{alunos}}
{{aluno.id}}
{{aluno.rga}}
{{aluno.nome}}
{{aluno.instituicao}}
{{aluno.campus}}
{{aluno.curso}}
{{aluno.semestre}}




另一个提示,如果您想在 alunos 数组为空时隐藏表格,v-if="alunos" 不起作用,因为 [ ] Đúng truthy ,alunos 初始化为 []。我相信 v-if="alunos.length" 就是你想要的。

关于javascript - 来自 Axios GET 响应的 VueJs 中的数组为空 | VUEJS/Laravel,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53346863/

28 4 0
Bài viết được đề xuất: javascript - 在 Vue 中实现 @keypress
Bài viết được đề xuất: amazon-web-services - 本地 DynamoDB
Bài viết được đề xuất: amazon-web-services - EC2 实例计划停用
Bài viết được đề xuất: javascript - 避免每次渲染 vue 组件时产生新的 axios 请求
行者123
Hồ sơ cá nhân

Tôi là một lập trình viên xuất sắc, rất giỏi!

Nhận phiếu giảm giá Didi Taxi miễn phí
Mã giảm giá Didi Taxi
Giấy chứng nhận ICP Bắc Kinh số 000000
Hợp tác quảng cáo: 1813099741@qq.com 6ren.com