Javascript 存储在html表行中的Vue响应数据

我在想我哪里出了问题。在下面的VUE脚本中，控制台日志显示了我期望的数据（准确地说是26条记录）。因此，我试图获取成功转储并添加到

dateEvents

中的数据，这样我就可以在HTML表中将每条记录显示为一行。我显然知道我的数据会返回到响应中，但是为什么我不能在我的表中看到它呢

<template>
    <div>
        <table style="width:100%; text-align:center;">
            <thead>
                <tr>
                    <!-- <th>ID</th> -->
                    <th>Title</th>
                    <th>Type</th>
                    <th>Available At:</th>
                </tr>
            </thead>
            <tbody>
                <tr>
                    <td>{{ dateEvents.name }}</td>
                </tr>
            </tbody>
        </table>
    </div>
</template>

<script>
import moment from 'moment'
export default {
    name: 'hello',
    data () {
        return {
            dateEvents: [],
            config: {
                defaultView: 'month',
                eventRender: function(event, element) {
                    console.log(event)
                }
            },
        }
    },
    created() {
        this.fetchTasks();
    },
    methods: {
      fetchTasks() {
        axios.get('/dashboard/tasks' )
            .then((response) => {
                // handle success
                console.log(response.data);
                this.dateEvents = response.data;
            })
            .catch(function (error) {
                // handle error
                console.log(error);
            })
            .finally(function () {
        });
    }
}
}
</script>

标题
类型
网址：
{{dateEvents.name}
从“时刻”导入时刻
导出默认值{
姓名：'你好'，
数据（）{
返回{
日期事件：[]，
配置：{
defaultView:'月份'，
eventRender:函数（事件，元素）{
console.log（事件）
}
},
}
},
创建（）{
this.fetchTasks（）；
},
方法：{
fetchTasks（）{
获取（“/dashboard/tasks”）
。然后（（响应）=>{
//成功
console.log（response.data）；
this.dateEvents=response.data；
})
.catch（函数（错误）{
//处理错误
console.log（错误）；
})
.最后（函数（）{
});
}
}
}

axios

上下文中的
此
函数不是Vue实例。您需要在变量中保存Vue实例：

var vm = this;
axios.get(...)
    .then( response => vm.dateEvents = response.data );

查看代码，我假设
dateEvents
是一个数组。在这种情况下，您需要添加一个
v-for
，以循环遍历此对象数组。尝试将模板更新为以下内容：


标题
类型
网址：
{{dateEvent.name}
此
引用Vue组件，因为它使用ES6风格的箭头函数。啊，是的！错过了。谢谢啊，老兄，这真是太好了！非常感谢。现在我可以用同样的方法使用if语句