is there anyway to return a array into different grid column

Question

I have a function like this, I want to put the cell in the left and right for the grid column, now it just put one by one, for the left grid column, it should be <GridColumn gridUnits={6}>, for the right one, it can be <GridColumn gridUnits={6} position='last'>, is there any to treat them differently based on the index, if it is odd, it belongs to left Grid Column, if it is even, it belongs to the right Grid Column?

How to achieve this?

 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>
        )
      );
    }

Answer 1

Could probably do something like this:

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>
        );
    }
}

Requires you to do two loops, but it should accomplish your goal. If you're not sure what the % operator does. Documentation can be found here.