我有一个这样的函数,我想将单元格放在网格列的左侧和右侧,现在它只是一个一个地放入,对于左侧网格列,它应该是<GridColumn gridUnits={6}>,对于右侧,它应该是可以是<GridColumn gridUnits={6} position='last'>,是否有根据索引对它们进行区别对待的方法,如果为奇数,则属于左Grid Column,如果为偶数,则属于右Grid Column?

如何实现呢?

 generateEquipmentListByCell(printerCellMap, dryerCellMap) {
    const equipmentKey = {...printerCellMap, ...dryerCellMap};
    if (!_.isEmpty(equipmentKey)) {
      return (
        Object.keys(equipmentKey).map((key, index) =>

          <GridColumn gridUnits={6}>
            <EquipmentCell printerList={printerCellMap[key]}
                           dryerList={dryerCellMap[key]}
                           index={index}/>
          </GridColumn>
        )
      );
    }

最佳答案

可以做这样的事情:

generateEquipmentListByCell(printerCellMap, dryerCellMap) {
    const equipmentKey = {...printerCellMap, ...dryerCellMap};
    if (!_.isEmpty(equipmentKey)) {
        return (
            <div>
                <GridColumn gridUnits={6}>
                {
                    Object.keys(equipmentKey).map((key, index) => (
                        (index % 2) ?
                            <EquipmentCell printerList={printerCellMap[key]}
                                           dryerList={dryerCellMap[key]}
                                           index={index}/> : null
                    ));
                }
                </GridColumn>
                <GridColumn gridUnits={6} position="last">
                {
                    Object.keys(equipmentKey).map((key, index) => (
                        (index % 2 !== 0) ?
                            <EquipmentCell printerList={printerCellMap[key]}
                                           dryerList={dryerCellMap[key]}
                                           index={index}/> : null
                    ));
                }
                </GridColumn>
            </div>
        );
    }
}


要求您执行两个循环,但它应该可以实现您的目标。如果不确定%运算符的作用。可以在here中找到文档。

10-08 16:40