【react】map 遍历json数据
来源:互联网 发布:阿里云 安骑士 编辑:程序博客网 时间:2024/06/05 04:58
数据格式:(此数据写在了getInitialState方法中)
list: [{ 'id':'1', 'title':'123', 'time':'2017', 'person':'cheny0815', 'type':'type', 'operation':'operation' },{ 'id':'2', 'title':'456', 'time':'2017', 'person':'cheny0815', 'type':'type', 'operation':'operation' },{ 'id':'3', 'title':'789', 'time':'2017', 'person':'cheny0815', 'type':'type', 'operation':'operation' }]
页面中遍历方法(此处用this.state.list便可以取到值)
<table> <tbody> <tr className="first_tr"> <td>内容</td> <td>发起人</td> <td>类型</td> <td>时间</td> <td>操作</td> </tr> { this.state.list.map(function(name){ return ( <tr key={name.id}> <td>{name.title}</td> <td>{name.person}</td> <td>{name.type}</td> <td>{name.time}</td> <td>{name.operation}</td> </tr> ) }) } </tbody></table>
使用map遍历时,需要给子元素添加一个key,作为唯一的标识,而且key值必须要连续,否则会报错
阅读全文
0 0
- 【react】map 遍历json数据
- react中的map遍历
- react的map遍历
- react map遍历
- 遍历json对象转成map
- Map 集合数据遍历
- react map遍历时事件无效
- React map遍历数组 批量传入图片
- Json数据转Map
- React.js-02-遍历数据
- js遍历json数据
- js遍历json数据
- 简单遍历json数据
- jquery遍历JSON数据
- jquery遍历json数据
- JSONCPP遍历JSON数据
- JSONCPP遍历JSON数据
- JS遍历后台传过来的JSON数据(由Map转化成)
- Java过滤字符串无效字符
- 利用HorizontalScrollView实现仿QQ的侧滑菜单
- exercise7
- Appium swip滑动
- [SAM] POJ1509 Glass Beads
- 【react】map 遍历json数据
- AttributeError: addinfourl instance has no __call__ method
- 在Eclipse中使用Maven构建Spring项目
- C++——NOIP2016提高组day1 t3——换教室
- 【bzoj1742】[Usaco2005 nov]Grazing on the Run 边跑边吃草
- 自定义之一个图片根据另一个图片形状进行裁剪
- Java设计模式-抽象工厂模式
- 最大子段和问题的动态规划解法
- listView与recyclerView的吸顶动画