使用 this 作為綁定參數時 SetState 不起作用（ReactJS）

Question

I have a binded function inside a map function which is activated by onClick, yet I cannot access this function because it seems that using this as a parameter stops setState working. 最初 buttonPress function 中的 setState 可以工作，但現在我添加了 bind(this, (key)) 以允許 key 參數通過，它跳過 setState，我只能 console.log()。

一切的目的是識別已單擊的條目，然后將其作為道具傳遞給子 class 組件。

map() function

<div ref={p => this.MyMenu = p} className="mainmenu">
<p className="title">Song List</p>
    <div className="songList">
        {song.map(song => (<div onClick={this.buttonPress.bind(this, song.key)}  key={song.key}  className="song-entry">
            <h3 className="song-name">{song.name}</h3>
            <p className="song-length">{song.length}</p>
            <p className="song-desc">{song.desc}</p>
        </div>))
        }

    </div>

    </div>

這里是 function 按鈕按下

buttonPress (key) {

    console.log(key);

    let localkey = key 


    this.setState({songchoice: localkey});

    console.log(this.state.songchoice);

    clearInterval(this.countdownInterval);
    this.setState({count:3, countdown:true, songchoice: key}, 
        ()=>{setInterval(this.countdownInterval, 3000); this.aboutTween = TweenMax.to(this.aboutSection, .8,{opacity:1, y: -100, ease: Power3.easeOut})});

}

如果您想查看整個頁面，還有一個 GitHub 鏈接。

Answer 1

是否有特定的綁定原因我不知道也許你可以嘗試過它是一種更簡單的方法，比如

onClick={ () => this.buttonPress(song.key)}

Answer 2

我想到了。 SetState 實際上正在工作，但由於它是異步設置的，因此控制台日志沒有發生反映更改。