牛骨文教育服务平台(让学习变的简单)
博文笔记

React-jsx二维数组的遍历

创建时间:2018-01-03 投稿人: 浏览次数:543

React中jsx对于二维数组的遍历可以通过map方法,记得需要为每一个元素传入一个key值,不然会报错,提示the key is unique;

const data = [
    [
        { title: "阿甘0", description: "讲述阿甘的奋斗" },
        { title: "阿甘1", description: "讲述阿甘的奋斗" },
        { title: "阿甘2", description: "讲述阿甘的奋斗" },
        { title: "阿甘3", description: "讲述阿甘的奋斗" },
    ],
    [
        { title: "阿甘4", description: "讲述阿甘的奋斗" },
        { title: "阿甘5", description: "讲述阿甘的奋斗" },
        { title: "阿甘6", description: "讲述阿甘的奋斗" },
        { title: "阿甘7", description: "讲述阿甘的奋斗" },
    ]
];
//通过唯一的title可以确定唯一的key;
{
    data.map( items => (
        items.map( item => (
           <div key ={item.title}>{item.description}</div>
        ))
    ))
}
声明:该文观点仅代表作者本人,牛骨文系教育信息发布平台,牛骨文仅提供信息存储空间服务。