vue.jsにて親コンポーネントから子コンポーネントへのデータの受け渡し

Question

現状と質問

vue.jsにて親コンポーネントから子コンポーネントへデータを渡したいのですが
現状、受け取ったデータをログで出力すると「undefined」となります。
どのようにしたら子コンポーネントへデータを渡すことができるのでしょうか。
ご教授いただきたいです。

詳細

・親コンポーネント
APIからデータを取得し、子コンポーネントへデータを渡す

import deviceSource from '../../components/charts/report/deviceSource'

export default {
  name: 'widget',
  components: {
    deviceSource,
  },
  data: function() {
    return {
      sammary_data: {},
    };
  },
  methods: {
    getSammaryData(){
        // API
        axios.post('')
        .then((res) => {
          this.sammary_data = res.data;
        });
    },
  },
  mounted () {
    this.getSammaryData();
  },
}

・子コンポーネント
propsでデータを受け取り、console.logで表示

export default {
  extends: Doughnut,
  props: {
    'sammary_data': {
      type: Object
    },
  },
  mounted () {
    console.log(this.sammary_data);
  }
}

Answer 1

apiからの取得を待たずにログ出力していたため、取得ができておりませんでした。
watchを使用することで、変数の変更を監視することができたため解決しました。

watch: {
   sammary_data: {
     handler: function () {
       console.log(JSON.parse(JSON.stringify(this.sammary_data)));
     },
     deep: true
   }
},