1.defineProps 属性
props可以实现父子组件通信,在vue3中我们可以通过defineProps获取父组件传递的数据。且在组件内部不需要引入defineProps方法可以直接使用!
javascript
const props = defineProps<{
agreePolicy: boolean
}>()
2. 声明触发的事件 defineEmits()
如果你正在搭配 TypeScript 使用 <script setup>
,也可以使用纯类型标注来声明触发的事件:
javascript
const $emit = defineEmits<{
loginSuccess: [response: LoginSuccessResType]
}>()
3.子组件使用defineExpose把那个变量暴露出去
defineExpose是vue3新增的一个api,放在<scipt setup>下使用的,目的是把属性和方法暴露出去,可以用于父子组件通信,子组件把属性暴露出去, 父组件用ref获取子组件DOM,子组件暴露的方法或属性可以用dom获取。
父组件用ref获取子组件dom拿到暴露的属性
javascript
defineExpose({
formData,
passRuleFlag,
codeLogin,
clearTimer
})