vue在created钩子函数请求异步数据问题 [Invalid prop]

错误提示

[Vue warn]: Invalid prop: type check failed for prop "value". Expected Boolean, got Undefined

父组件

<template>
    <follow-user v-model="article.is_followed">
    </follow-user>
</template>

export default {
  components: {
    FollowUser
  },
  data() {
    return {
      article: {}, // 文章详情
    }
  },
  created() {
    this.loadArtcileInfo()
  },
  methods: {
    // 加载文章数据
    async loadArtcileInfo() {
      try {
        // 随机错误
        // throw Error()
        const {
          data: { data }
        } = await getArticleById(this.articleId)
        this.article = data
        ...省略其他代码

子组件

  props: {
    // 接收 父组件传入的值
    value: {
      type: Boolean,
      required: true
    },

问题描述：

1. 在created生命周期内进行异步数据的请求，且将获取到的数据赋值给this.article。

2. 此时如果在mounted生命周期里获取this.article是获取不到的。

3. 同时传给子组件的值，还拿不到就为undefined，而自组件要求接收的值为Boolean，所以就会报错

解决办法

办法一

因为异步加载需要时间，如果延迟时间是可以获取到数据的，但是问题是不知道需要延迟多久，况且这个方法也不是很好。

办法二（推荐）

// 在data里进行数据的定义
data(){
	dataList:''
}

// 使用watch方法的数据监听
watch:{
	dataList(){
		this.$nextTick(()=>{
			//此时就可以获取到在created赋值后的dataList
		})
	}
}

参考文章：

• blog.csdn.net/Dark_progra…