从render方法中的嵌套函数中反映调用组件的方法

时间:2016-02-21 23:10:24

标签: javascript reactjs react-native react-jsx

我想在onCLick上调用updateCurrentThread方法,但是我遇到了以下错误:

  

未捕获的TypeError:无法读取未定义的属性“updateCurrentThread”

updateCurrentThread: function(thread) {
  this.setState({
  currentThread: thread
 }).bind(this);
},


render: function () {
  var threads = this.state.data.map(function (thread) {
    var boundClick = this.updateCurrentThread.bind(this, i);
    let time = getThreadDate(thread.timestamp);
    return (
      <div className="row thread" key={thread.threadID}>
        <ThreadParticipants onClick={boundClick} key={i} className="small-2 small-centered columns" ids={thread.participantIDs}/>
      </div>
  );
})

1 个答案:

答案 0 :(得分:6)

函数内的this的范围是函数,而不是组件。如果您能够使用词汇范围的ES6箭头函数,那么您当前的方法将起作用。在箭头功能之前,人们会将组件this存储在变量(例如var self = this)中,然后存储在self.updateCurrentThread中。