React循环遍历渲染数组和对象元素

遍历渲染数组

1.单纯数组

const pureArr = ['a','b','c','d']

//假如我们想将上面的数组利用react渲染成一个列表，代码如下：{
{pureArr.map(item => (
<li key={item}>item</li>
))}

以上代码在codesandbox中运行结果如下：

2. 对象数组

const objArr = [
  {
    value: "this",
    label: "this"
  },
  {
    value: "is",
    label: "is"
  },
  {
    value: "test",
    label: "test"
  }
];

//假如我们想将上面的数组利用react渲染成一个列表，代码如下：{
{objArr.map((item, idx) => (
       <li key={idx} className={classes.li}>
          {item.label} : {item.value}
        <