总结一下初学React的坑。
1、class必须用className代替,否则不识别,因为和js混淆
很多属性不识别,比如colspan
<table class="ui">
JSX要写成
<table className="ui">
<th colspan='6'></th>
JSX要写成
<th colSpan='6'></th>
我真是哔了狗了。对于不知道的入门者来说,几万年找不出错误也是很正常的,我一直在百度React 不识别class什么的,啥都没有,偶然看demo发现他写的是className,才想起来class是js的关键字,可我又不写ES6,我也不用class啊。
2、迭代多重json
这个东西在jquery里还是很简单的,就是,麻烦!
这也是JSX的好处。
事情是这样的,某天,我突然想装逼,考虑到我也看了几十分钟的React,说不定会用了,于是在一个文件里没有写jquery,用了React。
我的需求是这样的:
我有一个json:
var json={
'num':5,
'_s1':{
'class_Name':'balabala','point':'3','loc':'balabala'},
'_s2':{
'class_Name':'balabala','point':'3','loc':'balabala'},
'_s3':{
'class_Name':'balabala','point':'3','loc':'balabala'},
'_s4':{
'class_Name':'balabala','point':'3','loc':'balabala'},
'_s5':{
'class_Name':'balabala','point':'3','loc':'balabala'},
}
大概就是这样的结构,两重嵌套,我要把它放到一个好看的表格里
表格是这个样子的:
我的table结构是
<table class="ui celled padded orange table"><thead><tr><th class="single line">课程名称</th><th>课程学分</th><th>所属专业</th><th>上课地点</th><th>热度</th><th>是否选择</th></tr></thead><tbody><tr><td><h2 class="ui aligned header">高等数学</h2></td><td class="single line"><