Reactjs 如何使用onClick函数在子组件中设置父组件的状态？

我将只显示相关的代码。这是来自父组件的代码：

export default class App extends React.Component {

constructor(props) {
    super(props);
    this.state = {
        activeScreen: 'dashboard',
        authenticatedUser: this.getAuthenticatedUser(),
    }
}

setActiveScreen(key) {
    this.setState({
        activeScreen: key
    })
}

style = (label) => {
    if (label === 'Dashboard') {
        return {'border-top': '5px solid red'}
    }
}

render() {
    return (
        <div>
            {/* {this.serviceWorker()} */}
            <ToastContainer transition={Slide} />
            <Router>
                <Switch>
                    <NavBar  
authenticatedUser={this.state.authenticatedUser} activeScreen={this.state.activeScreen} 
setActiveScreen={this.setActiveScreen()} />

                </Switch>
            </Router>
        </div>
    );
}

我得到的错误是在现有状态转换期间无法更新（例如在

render

或其他组件的构造函数中）。渲染方法应该是道具和状态的纯函数；构造函数的副作用是一种反模式，但可以移动到

componentWillMount

。堆栈跟踪显示它位于

setActiveScreen

中。我无法解决这个问题

---

我的语法很好，但可能不是这样，因为我删除了很多不相关的代码

您正在调用没有参数的函数。用这个更新你的代码

setActiveScreen={this.setActiveScreen}

或

---

此行

setActiveScreen={this.setActiveScreen（）}

将其更改为

setActiveScreen={this.setActiveScreen}

。

setActiveScreen={this.setActiveScreen}

setActiveScreen={(key) => this.setActiveScreen(key)}