React JSX语法再实践
我们上一节封装了一个按钮,这一节我们继续理解封装的概念和了解封装组件需要注意的事项
首先我们回顾上一篇最后的代码,代码如下
const Button = ({color,text}) =>{ return { type: 'button', props: { className: `btn btn - $ { color }`, children: { type: 'em', props: { children: text, }, }, }, }; } 我们最终调用的形式如下所示 Button({color:‘blue’, text:‘Confirm’}) 进行创建,其实我们发现 Button 和 button 或者和 em 一样都可以 作为一个元素存在,我们可以以 Button 为基础创建特定属性的按钮,将其称为自定义类型的元素 或者可以称为组件元素。和上一节相同,我们可以采用 JSON 结构来描述它