typeScript+vue 子组件调用父组件方法

 一、子组件调用父组件方法

父组件 

<leave-form v-model="leaveModalShow" :btnType="btnType" @save-success="getpage" v-on:clearSelect="clearSelect(result)"></leave-form>

上面展示了两种方式：

1、@save-success="getpage"

2、v-on:clearSelect="clearSelect(result)  

可以传参数

 

子组件

 this.$emit('clearSelect',false);

 

 

二、父组件调用子组件方法

父组件

 <common-table  ref="commontable"  ></common-table>

  //调用，通过ref 名称          

(this.$refs.commontable as any).testClear()

子组件方法

 async testClear(){

   //清空表格选中行

   let t :any= this.$refs.userDataTable;

   t.clearSelection();

   //清空表格选中行

  //  (this.$refs.userDataTable as any).clearSelection();

 }