位置: IT常识 - 正文
聊聊vue3的defineProps、defineEmits、defineExpose
编辑：rootadmin聊聊vue3的defineProps、defineEmits、defineExpose 
本文链接地址:https://www.jiuchutong.com/zhishi/295201.html
转载请保留说明！
推荐整理分享聊聊vue3的defineProps、defineEmits、defineExpose，希望有所帮助，仅作参考，欢迎阅读内容。
文章相关热门搜索词:,内容如对您有帮助，希望把文章链接给更多的朋友！
最近在开发中用到了vue3的defineProps、defineEmits和defineExpose，感觉发现新大陆一般，所以利用闲碎时间对这三个方法做个总结。
definePropsconst props = defineProps<{ foo: String, bar?: Number}>()defineProps 是vue3的写法并且是一个仅 <script setup> 中可用的编译宏命令，并不需要显式地导入；在vue3的非语法糖setup和在vue2中的写法是 props 。 defineProps的大部分用法是进行父子组件传值。
注意：defineProps() 宏中的参数不可以访问 <script setup>中定义的其他变量，因为在编译时整个表达式都会被移到外部的函数中。
实例：父组件传值给子组件 父组件通过将值传递给子组件，子组件通过defineProps进行接收，子组件点击后将接收到的值 alert 出来 结果：
defineEmitsconst emit = defineEmits<{(e: 'submit', num: number): void}>()defineEmits 和 defineProps 一样也是仅用于 <script setup> ，并且不需要导入；在vue3的非语法糖setup中的写法是 emits 。 defineEmits 的不同点在于，组件要触发的事件可以显式地通过 defineEmits() 宏来
下一篇：H5页面内嵌到微信小程序和APP，做分享操作(h5页面内嵌到微信)