Invalid prop: type check failed

 

错误出处：

1.子组件

export default {
  name: 'EditApp',
  props: {
    form: {
      type: Object,
      required: true,
      default: Object
    }
  }
}

2.父组件

export default {
  name: 'Home',
  components: {EditApp, AppManager},
  data () {
    return {
      editapp: Object,
      isEditApp: false,
      user: JSON.parse(window.sessionStorage.getItem('user'))
    }
  }
}

3.调用处

  <EditApp v-show="isEditApp" :form="editapp"  @eventCancel="handleEditCancel"></EditApp>

 

问题原因：

由于vue是基于动态绑定的，子组件在form未被赋值前渲染，子组件无法获取到实际的值而是Object对象，导致渲染时发生异常。

解决办法：在 父组件中给予默认值

export default {
  name: 'Home',
  components: {EditApp, AppManager},
  data () {
    return {
      editapp: {},
      isEditApp: false,
      user: JSON.parse(window.sessionStorage.getItem('user'))
    }
  }
}