reactjs - 如何将类函数移到类之外并在 React 中仍然使用 this 关键字？

Question

在反应中我有这样的代码

export class Foo extends React.Component {
 function_name() {
   this.setState({blah: 'bleh'})
  }
 this.function_name()
}

但我真的很想让它像这样工作

function_name() {
 this.setState({blah: 'bleh'})
}

export class Foo extends React.Component {
 this.function_name()
}

有什么方法可以让这种事情发挥作用吗？基本上我希望类外的函数减少缩进。问题是我得到function_name is not a function.

标签： reactjs

Answer 1

您可以在声明/导出类后分配给原型：

export class Foo extends React.Component {
  this.function_name()
}
Foo.prototype.function_name = function() {
  this.setState({blah: 'bleh'})
};