问题描述
我对v-for有问题!
<template>
<div>
<h3>Tasks</h3>
<div class="card card-body" v-for="task in tasks" v-bind:key="task.id">
<h3>{{task.title}}</h3>
<p>{{task.body}}</p>
</div>
<div>
</div>
</div>
</template>
<script>
export default {
name: "Tasks",data(){
return{
tasks: [],task: {
id: '',user_id: '',title: '',body: '',priority: '',done: '',changed: ''
},task_id: ''
}
},created() {
this.fetchTasks();
},methods: {
fetchTasks() {
fetch('api/tasks').then(res => res.json()).then(data => {
this.tasks = data;
});
}
}
}
</script>
<style scoped>
</style>
我的div class =“ card card-body”未显示在页面上。但是,如果我删除v-for =“ task in task”,则会显示div。不明白为什么。
如果我在方法上尝试console.log(this.tasks)-没关系。 但是,如果我尝试在div“任务”或“数据”或“ this.tasks”中使用console.log,则表明数据等于[]
解决方法
暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!
如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。
小编邮箱:dio#foxmail.com (将#修改为@)