父组件传数据给子组件的数据消失了props，重新在子组件中随意修改某项代码，重新让页面渲染后又有数据，此后刷新又消失

问题代码：

```<template>
  <div style="  background-color: #f5f7fa;">
    <div class="main-body">
      <DetailCard :params="params" @datasource="getdata" />
      <DetailRate :result="result" />
      <DetailOther />
    </div>
  </div>
</template>
<script>

export default {
  name: '',
  components: {},
  data() {
    return {
      params: {},
      result: {}
    }
  },
  created() {
    this.$route.query.id
    console.log(this.$route.query.country);
    this.params = {
      countryCode: this.$route.query.country,
      ids: [this.$route.query.id]
      }
  },
  methods: {
    getdata(data) {
      this.result = data
      vuemain.$debugLog('page');
      vuemain.$debugLog(this.result);
    }
  }
}

问题描述：

这里通过getdata接收到子组件的数据是不为空的，我再把这个数据传递给DetailRate 组件，DetailRate中通过created函数接收该数据，该数据此后不管任何方式都无法显现，除非重新在子组件中随意修改某项代码，重新让页面渲染后又有数据，此后刷新又消失。

解决方案：

通过watch函数监听该数据变化，我这里就是监听result，只要watch函数监听到变化，再执行相对于的变化，从而解决问题。
原因：
可能是此时子组件的生命周期结束的时间比接收数据的发生的时间早，从而丢了数据，所以我也就使用了watch函数操作。

解决代码：

watch: {
result: {
handler() {
this.re = this.result
vuemain.$debugLog(this.re);
this.getdata();
}
}
},