React {this.state.xyz}在this.props.data.map內

Question

我想將一個狀態傳遞給this.props.data.map中的一個組件。但是我正在拋出一個錯誤。

下面是設置：

var PortraitNodes = this.props.data.map(function (image, i) { 
       return (
        <div className="portrait" key={i} > 
         <PortraitPhoto 
          imagepath={image.id} /> 
         <PortraitSpeaker 
          isPlaying={this.state.isPlaying} 
          whichPlaying={this.state.whichPlaying} 
          onToggle={this.playerAction} /> 
         <PortraitName 
          names={image.name} 
          title={image.title} /> 
        </div> 
       ); 

彷彿this正在訪問的地圖功能，它會出現。

這裏有什麼解決方法？

Answer 1

您需要將映射使用的函數綁定到組件的實例以便能夠訪問狀態。

this.props.data.map(function(){}.bind(this)); 

您也可以通過這個作爲參數傳遞給映射

.map(function(){}, this);