vue3.0传参方式整理
父传子
- defineProps
父组件通过属性传值
子组件通过const props = defineProps({ message: String })获取数据 - defineExpose加ref
子组件通过defineExpose（{funtionName}）暴露方法
父组件使用 ref（null）获取组件实例并通过.value.funtionName(message)传递数据
子传父
- 自定义事件
父组件传递自定义事件 @funName='functionName'
子组件接受事件const emit = defineEmits(['funName'])
子组件调用事件并传参 emit('funName',message) - defineExpose加ref
子组件通过defineExpose（{valueKey}）暴露数据
父组件使用 ref（null）获取组件实例并通过.value.valueKey获取数据
provide和inject夸组件传值
传值组件
import { provide } from 'vue'
provide(/* 注入名 / 'message', / 值 */ 'hello!')
接受组件
import { inject } from 'vue'
const message = inject('message')