小鸡啄米之React Map遍历中的key

map遍历

在jsx语法中，标签之间是可以使用{}来写js语法的，其中最常用的就是map遍历来输出一组标签

在react中一map出来的一组相同标签，必须提供一个key，这个key有利于提高程序运行和渲染效率，识别元素的增删，在局部环境中，key必须唯一，且不能改变

示例1：不提供key

const listItems = numbers.map((numbers) =>
  <li>{numbers}</li>
);

此时运行程序会提示需要提供key，将代码修改为
示例2：

  const listItems = numbers.map((number) =>
    <li key={number.toString()}>
      {number}
    </li>
  );

注意：key作为react内部变量，不会传递给组件，无法从组件中获取key值

jsx的{}中可以接受表达式，其结果是一个确定的值，不接受语句，不能出现var const let等关键字，如var a=1等
所以，也可以使用逗号表达式：

  {
    number=this.state.num,
    number.map(()=>{<Alert/>})
  }