在.map循環中限制項目

Question

我想問一下，我怎樣才能限制我的.map循環，例如只有5個項目，因爲目前當我訪問api時，它會返回20個項目。但我只想顯示5.我發現的大多數情況是循環遍歷整個對象數組，而不是將其限制爲多個項目。

注：我對API無法控制，因爲我只是用moviedb API

這裏是我的代碼：

var film = this.props.data.map((item) => { 
       return <FilmItem key={item.id} film={item} /> 
      }); 

      return film; 

Answer 1

你可以使用Array#slice並且只需要您需要的元素。

var film = this.props.data.slice(0, 5).map((item) => { 
     return <FilmItem key={item.id} film={item} /> 
    }); 

return film; 

如果不啃老族原始數組了，你可以用塞汀長度5變異數組和循環即可。