vue的<component>怎么动态获取绑定的多个组件的props的值

vue的怎么动态获取绑定的多个组件的props的值？这是一个tab切换的demo，三个切换按钮，点击切换对应的组件显示。新手一枚，这么写在选中组件1没选中的另外两个组件的情况下总显示caseconts2="[object Object],[object Object],[object Object],[object Object]"和caseconts2="[object Object],[object Object],[object Object],[object Object]"

<div class="casetabs">
   <ul class="clearfloat">
      <li @click="toggleTabs(index,tab.view)" v-for="(tab,index) in casetabs"  :class="{case_on:case_on==index}">{{ tab.type }}</li>
      </ul>
</div>

<component :is="currentView" :caseconts1="caseconts1" :caseconts2="caseconts2" :caseconts3="caseconts3"></component>

Vue.component("case1", {
  template: `#casecont`,
  props: ['caseconts1'],
  data() {
    return {
      },
    }
  }
})
Vue.component("case3", {
  template: `#casecont`,
  props: ['caseconts1'],
  data() {
    return {
      },
    }
  }
})
Vue.component("case2", {
  template: `#casecont`,
  props: ['caseconts1'],
  data() {
    return {
      },
    }
  }
})

caseconts1,caseconts2,casecont3是json获取的

var app = new Vue({
            el: '#dre',
            data: {
                casetabs: [
                    { type: '最新案例', view: 'case1' },
                    { type: '热门案例', view: 'case2' },
                    { type: '经典案例', view: 'case3' }
                ],
                caseconts1:[],
                caseconts2:[],
                caseconts3:[],
            },
                        mounted: function () {
                this.$nextTick(function () {
                    app.cartView();
                })
            },
            methods: {
                cartView: function () {
                    var _this = this;
                    this.$http.get("data/index.json", { "id": 123 }).then(function (response) {
                        _this.caseconts1 = response.data.result.caseconts1;
                        _this.caseconts2 = response.data.result.caseconts2;
                        _this.caseconts3 = response.data.result.caseconts3;
                    });

可以先打印一下数据看看拿没拿到