SetState не работает при использовании этого в качестве параметра для привязки (ReactJS) - PullRequest
0 голосов
/ 18 апреля 2020

У меня есть связанная функция внутри функции карты, которая активируется onClick, но я не могу получить доступ к этой функции, потому что кажется, что использование этой функции в качестве параметра прекращает работу setState. Первоначально setState в функции buttonPress работал бы, но теперь, когда я добавил bind (this, (key)), чтобы позволить параметру key проходить, он пропускает setState, и я могу только console.log ().

Цель всего состоит в том, чтобы определить, какая запись была нажата, а затем передать ее в качестве реквизита компоненту дочернего класса.

Функция map ()

<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>

и вот функция buttonPress

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, если вы хотите просмотреть всю страницу.

Ответы [ 2 ]

0 голосов
/ 30 апреля 2020

Я понял это. SetState фактически работал, но поскольку он был установлен асинхронно, журнал консоли не отражал изменения.

0 голосов
/ 18 апреля 2020

Есть ли конкретная c причина для привязки, я не знаю. Может быть, вы могли бы попробовать это гораздо проще, что-то вроде

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

...