TS 父组件获取子组件的数据和方法

场景

开发过程中,有些时候需要给子组件进行赋值操作,但是子组件本身已经存在这请求数据的方法,父组件的按钮触发后会获取新的数据,赋值给子组件的tableData数据

子组件

<template>
.....
</template>
<script setup lang="ts">
  import {  ref, defineExpose } from 'vue';
  let tableData=ref([])
  let setTableData = ()=>{
  ......
  }
  //暴露出去之后,父组件才能获取到
  defineExpose (
  tableData,
  setTableData 
  })

</script>

父组件

<template>
<childVue ref='childVue '  />
</template>
<script setup lang="ts">
  import { ref } from 'vue';
let childVue =ref()   //通过对应childVue的ref值定义
console.log(childVue.value)   //可以在其中拿到子组件暴露出来的tableData