- React.js 16从入门到实战
- 王金柱
- 225字
- 2021-03-24 11:10:32
2.6 JSX对象表达式
在React JSX中可以直接使用对象表达式,也就是说完全支持obj.property的表达式形式。下面看一个具体的代码实例:
【代码2-6】(详见源代码目录ch02-react-jsx-exp-obj.html文件)
![](https://epubservercos.yuewen.com/27D3F5/16499866705998906/epubprivate/OEBPS/Images/Figure-P38_5105.jpg?sign=1739054663-lZP15hG2meWXOp9bPUKTJbhkzY2UJrQM-0-fbe04d59a67f7486e35a83ea5621ea38)
关于【代码2-6】的说明:
●第18~22行代码中通过const运算符定义了一个常量对象(userinfo),并初始化了一组属性。
●在第27行代码定义的JSX中,分别通过对象表达式“{userinfo.name}”“{userinfo.gender}”和“{userinfo.age}”的方式使用了常量对象(userinfo)的属性值。
测试网页的效果如图2.5所示。如图中的箭头所示,在JSX中使用的一组对象表达式分别显示出了预先所定义的内容。
![](https://epubservercos.yuewen.com/27D3F5/16499866705998906/epubprivate/OEBPS/Images/Figure-P39_5341.jpg?sign=1739054663-iAmwfLULi9EmEbogNCcPmId3ajcoqYCf-0-0af37d2fcfd16c58bb49a9b0c97e0515)
图2.5 React JSX对象表达式