Vue3.0中使用ref来调用子组件的方法

Vue3.0中使用ref来调用子组件的方法

Vue2.0

父组件

template

<Table ref="eleTable">Table>

methods

this.$refs.eleTable.子组件的方法名+()
this.$refs.eleTable.子组件的属性名

Vue3.0

父组件

template

<Table ref="eleTable">Table>

TypeScript

<script lang="ts">
import { ref } from 'vue'
setup() {
	const eleTable = ref(); // eleTable是属性ref的内容
	const clickSon = () => {
		eleTable.value.changeShowText(); // 调用子组件的方法
		let arr = eleTable.value.tableData; // 获取子组件setup里面定义的变量
	} 
}
</script>

你可能感兴趣的:(Vue3,vue)