2024-12-19 vue3(day5)

207 阅读1分钟

image.png 父传子

image.png 子传父(父传给子一个方法,子调用,传递参数)

image.png defineProps另一种声明方式

image.png emit自定义事件,实现子传父

image.png 自定义事件名推荐写成短横线命名

image.png 安装mitt

image.png 创建emitter实例,发送事件,监听事件

image.png 解绑事件

image.png 解绑所有事件

image.png mitt实现组件和组件的直接通信

image.png 这两种写法是等价的

image.png 子组件没有defineProps接收的数据都会跑到$attrs里面去

image.png

image.png 子组件将数据暴露出去,父组件则可以通过ref访问操作子组件数据

父组件也可以通过$refs获取所有的ref实例,然后再访问子组件暴露的数据

image.png 父组件暴露数据

image.png 子组件通过访问$parent访问父组件暴露的数据

image.png

image.png provide和inject进行祖孙通信

image.png 默认插槽

image.png 具名插槽

image.png v-slot可以用#简写