父组件调用子组件的数据

要在父组件中调用子组件的数据，可以通过以下几种方式实现：

1. 使用props：在子组件中定义一个prop属性来传递数据，然后在父组件中使用子组件时，通过设置对应的属性值来获取子组件的数据。

2. 使用ref：通过在子组件上使用ref属性，然后在父组件中通过ref来访问子组件实例，从而获取子组件的数据。

下面是一个示例代码，展示了如何在父组件中调用子组件的数据：

// 子组件
Vue.component('child-component', {
  data() {
    return {
      childData: '子组件数据'
    };
  },
  template: '<div>{{ childData }}</div>'
});

// 父组件
new Vue({
  el: '#app',
  template: '<div><child-component ref="childComponent"></child-component><button @click="getChildData">获取子组件数据</button></div>',
  methods: {
    getChildData() {
      const childData = this.$refs.childComponent.childData;
      console.log(childData);
    }
  }
});