mpvue开发小程序中，防止组件传值错误

for example:javascript

组件 A :java

// 组件A
<template>
  <div>
    xxxxxx
  </div>
</template>
<script>
export default {
  props: ['ownerType', ],
  data() {
    return {}
  }
}
</script>

使用咱们的组件 Aweb

<template>
  <div>
    <A :ownerType="ownerType"></A>
  </div>
</template>
<script>
import A from 'xxxxx';

export default {
  components: {
    A
  }
  data() {
    return {
      ownerType: ''
    }
  },
  onLoad() {
    // 页面加载时赋值ownerType
    this.ownerType = 'user'
  }
}
</script>

    当咱们这么使用的时候，有时候屡次进入使用组件A这个页面，有时候会出现组件传递的值为 空 ，
也就是咱们 data 中设置的默认值，这多是页面退出后组件没有被销毁，致使传值的时候，ownerType 还没被赋值！！！！！svg

个人笨一点的解决办法是，再 onLoad中等待加载逻辑执行完成，再显示页面，也就是给最外层的div 添加一个判断，数据还没加载完成，就不显示页面。this

伪代码以下:spa

<template>
  <div v-if="SHOW">
    <A :ownerType="ownerType"></A>
  </div>
</template>
<script>
import A from 'xxxxx';

export default {
  components: {
    A
  }
  data() {
    return {
      SHOW: false,
      ownerType: ''
    }
  },
  onLoad() {
    // 页面加载时赋值ownerType
    this.ownerType = 'user'
    //加载逻辑执行完成，再显示页面
    this.SHOW = true
  }
}
</script>