使用Antd注销时按钮单击时出错

Question

我正在尝试使用antd的Menu.Item创建带有注销选项的导航栏。 我在按钮单击条件上遇到错误。下面是我的代码。

handleClick = (e: ClickParam) => {
if(e.key === 'logout') {
   if (userContext) userContext.onLogout(); 
//error cannot find name userContext (as it is defined below)
} else {
  this.props.history.push(e.key);
}
}; 

render() {
const SubMenu = Menu.SubMenu;
return (
  <div>
    <CurrentUserConsumer>
      {userContext => (
        <Fragment>
          <div>
            <UserAvatar name={userContext && userContext.user ? userContext.user.firstName : ''} />
          </div>

          <Menu onClick={this.handleClick} selectedKeys={[this.props.history.location.pathname]} mode="vertical" className="App-menu-wrapper">
          <Menu.Item 
            key="/logout">
                <span>
                <Icon type="form" />
                Logout
                </span>
            </Menu.Item>

请为我建议其他解决方案，以便在单击注销后成功注销。