vue开发中，数据还没获取，页面已经渲染，导致页面没有数据
·
在使用vue的时候，经常会遇到这种问题：异步请求，或者是通过组件传值获取数据时，部分页面会在数据获取之前就渲染，导致数据加载不出来。
如何解决？
使用 v-if
根据需求,可以在vue生命周期beforeCreate，created的时候就调用接口获取数据，在成功拿到数据之后的回调函数里面，控制页面显示，可以最大程度上避免页面跳动的问题。由于渲染和请求是异步的，我们可以等到数据请求回来之后，再把页面放出来。
上代码
<h4 v-if="isShow">{{ data }}</h4>
<script>
data: function () {
data: {},
// 不显示数据
isShow:false
},
created() {
this.getData();
},
methods:{
async getData(){
let data = await axios.get('/url')
this.data = data
// 显示数据
this.isShow = true
}
}
</script>
旨在为数千万中国开发者提供一个无缝且高效的云端环境，以支持学习、使用和贡献开源项目。
更多推荐
13
0- 0
已为社区贡献2条内容
所有评论(0)