使用 .jsx 格式文件 和 defineComponent

引用自定义组件,传递属性

基本使用

 child.jsx  组件的配置

demo.jsx   setup 函数

父组件引用

import demo from './components/demo.jsx'

JSX 和 template 语法的区别

JSX 本质就是 js 代码,可以使用 js 的任何能力

template 只能嵌入简单的 js 表达式,其他需要指令, 如 v-if

JSX 已经成为 ES 规范,template 还是 Vue 自家规范

JSX 和 template 本质相同,都会被编译为 js 代码 (render 函数)

使用 JSX 实现 slot

使用 JSX 实现 作用域插槽

父组件

 子组件

属性和事件

defineProps

defineEmits

defineExpose

暴露数据给父组件

子组件

 

父组件

 

1

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐