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. C# ConcurrentQueue实现

    我们从C# Queue 和Stack的实现知道Queue是用数组来实现的,数组的元素不断的通过Array.Copy从一个数组移动到另一个数组,ConcurrentQueue我们需要关心2点:1线程安全 ...

  2. Excel分组快速自动填充编号

    在Excel自动填充很简单,但如果按分组等条件进行填充就有点麻烦了 说麻烦可能是你并没有搞清楚到底如何才能实现你的需求   下图是客户提供的Excel数据,我需要将下面的数据导入到数据库中,因为客户在 ...

  3. LiteIDE 在 Windows 下为 Go 语言添加智能提示代码补全

    本文以 Windows 7 64 位为环境,go1.4.2.windows-amd64 和 liteidex27.2.1.windows-qt5 为例. 成功搭建开发环境后,发现 LiteIDE 没有 ...

  4. .NET Core修改监听端口

    把Program.cs加一行UseUrls代码如下: using System.IO; using Microsoft.AspNetCore.Hosting; using Microsoft.AspN ...

  5. windows多线程--原子操作

    推荐参考博客:秒杀多线程第三篇 原子操作 Interlocked系列函数 原子操作 VS 非原子操作 原子操作就是不会被线程调度机制打断的操作,这种操作一旦开始,就一直运行到结束,中间不会有任何线程切 ...

  6. windows多线程同步--信号量

    推荐参考博客:秒杀多线程第八篇 经典线程同步 信号量Semaphore   首先先介绍和windows信号量有关的两个API:创建信号量.释放信号量   HANDLE WINAPI CreateSem ...

  7. sublime text修改package安装路径

    删除C:\Users\Administrator\AppData\Roaming\Sublime Text 3下面的packages目录 在\Sublime Text 3安装路径下新建Data文件夹 ...

  8. MySQL空间索引简单使用

    简述 MySQL在5.7之后的版本支持了空间索引,而且支持OpenGIS几何数据模型.国内的MySQL相关的书籍都比较老了,在这方面有详细描述的还没有见过.有一本比较新的PostgreSQL的数据介绍 ...

  9. (原)pycharm中使用CUDA_VISIBLE_DEVICES

    转载请注明出处: http://www.cnblogs.com/darkknightzh/p/8576825.html 如果使用多gpu运行程序,可以直接使用CUDA_VISIBLE_DEVICES= ...

  10. Struct(二)

    struct2 权威指南 这一节通过一个详细的实例来讲解Struct2框架的应用 1 下载和安装Struts 2框架 (1) 登录http://struts.apache.org/download.c ...