在React Lifecycle方法中使用局部方法

Question

我很好奇以下代码是否有效：

 class App extends React.Component { componentDidMount() { logger('mount') } componentDidUpdate() { logger('update') } logger = x => { console.log(x) } render() { return ( <div className='container'> </div> ) } } ReactDOM.render(<App />, document.getElementById('app')) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> <div id="app"></div> 

我已经在React上工作了一段时间，但从未遇到过在生命周期方法中使用本地方法的原因，但是我认为出于好奇，我今天会尝试使用它。 我至今无法找到任何指定的解释，为什么这可能行不通。 是应用程序初始化的顺序，只是在调用时没有看到它，还是我没有想到的基本内容？

Answer 1

我相信这可能就像将this.logger('mount')和this.logger('update') logger('mount')和logger('update') this.logger('mount')一样简单:)

Answer 2

您需要为此添加函数调用this. 访问本地方法：

 class App extends React.Component { componentDidMount() { this.logger('mount') } componentDidUpdate() { this.logger('update') } logger = x => { console.log(x) } render() { return ( <div className='container'> </div> ) } } ReactDOM.render(<App />, document.getElementById('app')) 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> <div id="app"></div>