我想映射一个数组，并找到数组中的对象的索引

我有一个组件，我想找到对象数组中的索引（现在我有一个硬编码的对象数组，但后来会正在使用调用来获取数据）。我想在数组的每个第五个位置添加一个2的mdOffset。我将如何去做这件事？我的代码：我想映射一个数组，并找到数组中的对象的索引

export default class Winks extends Component { 
    constructor() { 
    super() 
    this.state ={ 
     items: [ 
     { id:1, name: "The Kooples - white top", url:"bloomingdales.com", src: "assets/male.png" }, 
     { id:2, name: "Sandro-Orange Zipper", url:"saksfifth.com", src: "assets/female.png" }, 
     { id:3, name: "Sandro-Orange Zipper", url:"saksfifth.com", src: "assets/female.png" }, 
     { id:4, name: "Sandro-Orange Zipper", url:"saksfifth.com", src: "assets/female.png" }, 
     { id:1, name: "Sandro-Orange Zipper", url:"saksfifth.com", src: "assets/female.png" }, 
     { id:1, name: "The Kooples - dress", url:"bloomingdales.com", src: "assets/male.png" }, 
     { id:1, name: "The Kooples - dress", url:"bloomingdales.com", src: "assets/male.png" }, 
     ] 
    } 
    } 

    render() { 

    var listItems = this.state.items.map.bind(this)(function(item) { 
     if (this.state.items.indexOf(item) % 5 === 0) { 
     var columns = (
      <Col md={2} mdOffset={2}> 
       <img className='img-responsive' src={item.src}></img> 
      <Row> 
       <span>{item.name}</span> 
      </Row> 
      <Row className="pull-right"> 
       <i className="fa fa-heart"></i> 
      </Row> 
      </Col> 
     ) 
     } 

     else { 
     var columns = (
      <Col md={2}> 
       <img className='img-responsive' src={item.src}></img> 
      <Row> 
       <span>{item.name}</span> 
      </Row> 
      <Row className="pull-right"> 
       <i className="fa fa-heart"></i> 
      </Row> 
      </Col> 
     ) 
     } 

     return columns 
    }); 

    return (
     <Row> 
      {listItems} 
     </Row> 
    ) 
    } 
}

来源

2016-10-06 Long Phan

当你映射你的元素的索引作为第二个参数https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map

例：

arr.map(function(item, index) { 
    if (index % 5 === 0) { 
    // do your stuff here 
    } 
});

或者

arr.map(function(item, index) { 
    <Col mdOffset={index % 5 === 0 ? 2 : null}> 

    </Col> 
});

来源

2016-10-06 19:54:48 EQuimper

如果他想每个第五元素这不会因为索引从0开始而被关闭吗？ '[1,2,3,4,5] .forEach（function（item，index）{if（index％5 === 0）{console.log（item）}}）'唯一将被记录的项目是0％以来的第一个指数，任何东西都是0，第五个项目的索引是4，因此没有通过条件 – finalfreq

好的一个是的，我检查了这个 – EQuimper

我想我可能说错了，但是Emanual给我工作的是什么，我基本上希望数组的第6个索引或第5个项目做些什么。 [1,2,3,4,5,6] .forEach（function（item，index）{if（index％5 === 0）{console.log（item）}}）它吐出0和6哪个是我想要的。连续5个项目，第6个项目开始新行 –

我想映射一个数组，并找到数组中的对象的索引

回答

相关问题