vue.js - vue组件中数据是通过axios返回的，但是没等axios返回就渲染了，这个怎么解决？

问题描述

问 题

<template>
   <!--这里如果axios还没有返回数据那么就报name undefined，这个怎么解决？？？-->
   <mycomponent :mydata="thisdata.name"/>
</template>
<script>
   export default{
     data(){
       return {
          thisdata:null
       }
     },
     methods:{
       getThisData(){
         let that = this;
         axios.get('')
         .then(function(res){
           that.thisdata = res.data;
         })
       }
     }，
     components:{
       mycomponent
     }
   }
</script>

解决方案

<mycomponent :mydata="thisdata&&thisdata.name"/>这么做就不会报错了，

 getThisData(){
         let that = this;//可以不用that
         axios.get('')
         .then(function(res){
           that.thisdata = res.data;
         })
       }

直接用箭头函数：

 getThisData(){
         axios.get('')
         .then((res)=>{
           this.thisdata = res.data;
         })
       }

这篇关于vue.js - vue组件中数据是通过axios返回的，但是没等axios返回就渲染了，这个怎么解决？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！