Vue.sj,v-for无法正常工作,我的数据为空

问题描述

我对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 (将#修改为@)