处理vue异步请求数据动态从父组件向子组件赋值时，子组件无法获取到值问题

1. 组件执行顺序导致：
    父组件：created->子组件:created->子组件：mounted->父组件：mounted
2.问题子组件无法获取到值
    

//父组件
export default {
    data(){
	  return{
          arr:[]
      }
    },
    created(){
        
    },
    methods:{
        getData(){
           _getListData({id:xxx}).then(res => {
               this.arr = res
            }).catch(err=>{
                console.log("xxxx")
            })
        }
    }
}
//子组件
export default {
    props: {
        formOptions: {
		  type: Array,
		  default: () => {
				return []
		   }
		}
    },
    data(){
	  return{
          inFormOptions:[]
      }
    },
    created(){
       this.inFormOptions = this.inFormOptions
    }
}

3. 原因：

根据父组件的执行顺序，父组件传递过来的formOptions是初始值，因此赋值失败。

4. 解决方法：

        在父组件引用的地方添加v-if进行判断，如异步请求的值为初始值时则不渲染子组件，等到异步获取值完成后，v-if再进行渲染

        

<z-form v-if="arr.length" :form-options.sync="arr" ref="z-form"></z-form>