<template>
<div>
<ul v-show="isList">
<li v-for="t in List" :key="t.id" >
<router-link :to="{
path:'/home/message/detail',
query:{
id:t.id,
title:t.title
}
}">{{t.title}}</router-link>
</li>
</ul>
<h1 v-show="!isList" style="text-align:center">加载中。。。</h1>
<hr />
<router-view></router-view>
</div>
</template>
<script>
import axios from 'axios'
export default {
data(){
return{
list:[
{id:'001',title:''},
{id:'002',title:''},
{id:'003',title:''},
{id:'004',title:''},
],
isList:false
}
},
computed:{
List(){
this.list.forEach((t) => {
axios.get('https://v1.hitokoto.cn/').then(response => {
t.title = response.data.hitokoto
})
})
setTimeout(()=>{
this.isList = true//如果在这里加个1秒钟定时器就不会一个一个缓慢的加载出来了,直接呈现出整个列表,为什么呢
},1000)
return this.list
}
}
};
</script>
![](https://profile-avatar.csdnimg.cn/c21093c3bf8b46fea495e1f30454f3f2_qq_36757519.jpg!4)
求解答,为什么我这里使用axios请求在页面加载缓慢
- 写回答
- 好问题 0 提建议
- 追加酬金
- 关注问题
- 邀请回答
-
4条回答 默认 最新
悬赏问题
- ¥15 Collection contains no element matching the predicate
- ¥20 冻品电商平台的搜索是怎么实现的
- ¥15 如何搞一个可以控制、显示马达频率
- ¥15 WPF动态创建页面内容
- ¥15 如何对TBSS的结果进行统计学的分析已完成置换检验,如何在最终的TBSS输出结果提取除具体值及如何做进一步相关性分析
- ¥15 SQL数据库操作问题
- ¥100 关于lm339比较电路出现的问题
- ¥15 Matlab安装yalmip和cplex功能安装失败
- ¥15 加装宝马安卓中控改变开机画面
- ¥15 STK安装问题问问大家,这种情况应该怎么办