安装组件时反应触发onclick答案

【问题标题】：react triggers onclick when component is mounted安装组件时反应触发onclick
【发布时间】：2015-07-20 03:03:02
【问题描述】：

我正在将一个组件传递给一个嵌套组件，这是一个修改父组件状态的onClick 方法。

在挂载组件（不确定它是父组件还是子组件）时，会以某种方式调用该方法。现在，我收到以下错误消息：

未捕获的错误：不变违规：setState(...)：无法更新在现有状态转换期间（例如在render 内）。使成为方法应该是 props 和 state.invariant 的纯函数

传递孩子的代码如下所示

    var playlists = this.props.data.map(function(playlist) {
      return (
        <PlaylistItem key={playlist.id}
                      data={playlist}
                      showPlaylistCode={this.getPlaylistCodeData} 
        />
      );
    }.bind(this));

【问题讨论】：

看起来不错。别的东西正在破裂。我们需要查看更多代码。
@UAvalos 我不确定要显示哪些代码部分，因为我不确定什么是相关的
@UAvalos 因为我不确定，所以我把它们都放在这里gist.github.com/angelathewebdev/31a5e441a3a152dea019
在播放列表项的第 20 行，您实际上是在调用 on click 函数

标签： reactjs

【解决方案1】：

在您的播放列表项组件中，第 20 行，尝试将其更改为：

<div className="playlistCode i mfi-qr-code" onClick={this.props.showPlaylistCode.bind(this, this.props.data.id)}></div>

当你需要向一个在 React 中使用 onClick 的函数发送参数时，你需要使用 bind。与任何使用 bind() 一样，第一个参数应该是 this 的上下文，第二个应该是您要发送到点击处理函数的内容。

【讨论】：