react的列表数据一般是用map循环显示的。

使用map注意:map的回调函数为箭头函数时,后面如果加大括号(箭头函数常规编写),必须要有return才可以,如果箭头函数后面没有大括号(箭头函数简写),可以不用加return。

这是因为:箭头函数简写时只需要一个表达式和一个返回值。常规编写时必须有一个明确的返回值。

不加return如下:

如下代码加return:

class MyMenue extends Component {
render() {
const arry = ["首页", "管理", "详情", "联系"];
return (
<ul className = "nav navbar-nav " >
{
arry.map((element) =>{
return(
<li key = { element } >
<a className = "" > { element} </a>
</li >)
})
} </ul> )
}
}

react列表数据显示的更多相关文章

  1. React 列表页面传递参数

    React 列表进入详情页面 首先安装 react-router-dom (4.0) npm/yarn install react-router-dom 路由跳转配置 列表 父组件 this.prop ...

  2. react 列表渲染

    https://reactjs.org/docs/lists-and-keys.html#keys 以下代码运行会报错:Warning: Each child in an array or itera ...

  3. 甩掉DataList,Repeater,列表数据显示得灵活--转

    在WebForm 显示列表数据我们一般使用服务器控件Repeater.DataList或者GridView ,功强大能,使用简单.但同时也是有代价的, 一:不管你用哪个控件都需要牺牲一些额外的性能,因 ...

  4. 1-Recyclerview使用系列之Recyclerview的列表数据显示

    使用步骤已经写到我的公众号,二维码在下面,欢迎关注,谢谢. 本人联系方式: 更多精彩分享,可关注我的微信公众号: 若想给予我分享更多知识的动力,请扫描下面的微信打赏二维码,谢谢!: 微信号:Weixi ...

  5. React列表

    const numbers = [1, 2, 3, 4, 5]; const listItems = numbers.map((numbers) => <li>{numbers}&l ...

  6. react列表中,当key改变后发生的事情

    Main.jsx export default class Main extends PureComponent { constructor(props) { super(props); this.s ...

  7. Devxtreme 显示Master-Detail数据列表, 数据显示颜色

    ////刷新3/4簇Grid //function GetClusterGrid(id, coverageId, clusterId) { // var region = getRegionCityN ...

  8. 微信小程序云开发-数据库-商品列表数据显示N条数据

    一.wxml文件 在wxml文件中,写页面和点击事件,添加绑定事件limitGoods  二.js文件 在js文件中写limitGoods(),使用.limit(3)表示只显示3条数据

  9. 基于CkEditor实现.net在线开发之路(7)列表页面开发动作介绍

    一个列表页面不止是查询,它也包含了很多业务上功能的实现,这些业务功能的实现的逻辑我称之为动作.如触发单击按钮删除数据,更改业务表数据,调用webService,调用WCF接口,弹出新窗体新增.修改.查 ...

随机推荐

  1. Fragment的可见再载入的方法(真正的Fragment的OnResume和OnPause)

    一 起因 我们在做应用的过程中,一个应用的界面可能是多个Fragment切换而成的.可是如果在每次应用启动的时候就去载入大量的网络数据(如果你的每一个Fragment都须要载入网络数据.你也能够理解为 ...

  2. sqlite3命令行查看中文乱码问题解决

    SQLite库包含一个名字叫做sqlite3的命令行,它可以让用户手工输入并执行面向SQLite数据库的SQL命令.我们通过程序创建的数据库一般位于/data/data/程序db设置的content类 ...

  3. 天猫魔盒1代TMB100E刷机, 以及右声道无声的问题

    这个是在小米盒子1代之后买的, 当时速度比小米盒子快, 除了遥控器比较软, 电池盖不太对得齐以外, 用起来还不错. 但是时间长了之后总是不停自己升级, 自己安装一些应用, 还删不了, 要知道这个盒子的 ...

  4. js获取过滤条件中参数的快捷方式

    // window.location.href = "topupRecordController.do?exportExcel&" + encodeURI($(" ...

  5. cas 资源

    http://blog.sina.com.cn/s/blog_6fda308501012tk2.html http://www.blogjava.net/xmatthew/archive/2008/0 ...

  6. python排序出现的问题以及解决方案

    对某个文件夹中的文件重命名的时候,发现有些文件丢失,代码如下: #coding=gbk # Findthe every dir, if 01.rm exist in it, then rename i ...

  7. JAVA常用代码

    一. 判断是否包含某个注解.    1). 声明接口 @Retention(RetentionPolicy.RUNTIME) @Target(ElementType.TYPE) @Documented ...

  8. Adobe Illustrator for Mac(矢量图处理软件)破解版安装

    1.软件简介    Adobe Illustrator CC 是 macOS 系统上一款矢量绘图工具,可以说是是业界标准矢量绘图标杆,软件通过形状.色彩.效果及印刷样式,展现您的创意想法.在处理大型复 ...

  9. [Aaronyang] 写给自己的WPF4.5 笔记13[二维自定义控件技巧-可视化状态实战,自定义容器,注册类命令,用户控件补充]

     我的文章一定要做到对读者负责,否则就是失败的文章  ---------   www.ayjs.net    aaronyang技术分享 博文摘要:欢迎大家来支持我的<2013-2015 Aar ...

  10. PHP可变参数

    0x00 缘起 在laravel的源码里经常可以看到下面的函数形式 $func(...$args) 0x01 可变参数旧写法 这表示$func支持可变参数,在php5.6之前则是在函数体内调用 fun ...