vue3学习笔记(2)

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
})
相关推荐
安建资小栗子3 分钟前
2025年汽车加气站操作工备考题库
笔记
花楸树15 分钟前
前端搭建 MCP Client(Web版)+ Server + Agent 实践
前端·人工智能
wuaro15 分钟前
RBAC权限控制具体实现
前端·javascript·vue
专业抄代码选手20 分钟前
【JS】instanceof 和 typeof 的使用
前端·javascript·面试
用户00798136209720 分钟前
6000 字+6 个案例:写给普通人的 MCP 入门指南
前端
用户876128290737425 分钟前
前端ai对话框架semi-design-vue
前端·人工智能
干就完了127 分钟前
项目中遇到浏览器跨域前端和后端解决方案以及大概过程
前端
我是福福大王30 分钟前
前后端SM2加密交互问题解析与解决方案
前端·后端
实习生小黄33 分钟前
echarts 实现环形渐变
前端·echarts
齐尹秦40 分钟前
HTML5 Web Workers 学习笔记
笔记·学习