react-burger-menu isOpen prop对状态变化无反应

Question

我的应用将react-burger-menu用于仅限移动的汉堡菜单。单击菜单中的项目时，我希望菜单关闭，但是什么也没有发生。 （旁注-如果我在父组件中设置react-burger-menu，则它确实在页面加载时处于打开状态，并且当我第一次单击列表项时，侧边栏确实会关闭，但是如果我重新打开它，然后再试一次，则什么也没有发生。）

父项（menuIsOpen: true）：

full code

子组件（

this.state = {
  menuIsOpen: false
};

// Gets called when an item in sidebar is clicked
handleVenuesListItemClick = venue => {
    this.setState({ menuIsOpen: false });
};

render() {
  return (
    <Sidebar
      menuIsOpen={this.state.menuIsOpen}
    />
  );

）：

full code

查看实时版本：

<Menu isOpen={this.props.menuIsOpen}>
  <div className="sidebar">

  </div>
</Menu>

Answer 1

发生了同样的问题。我认为问题在于您没有在听汉堡按钮来open菜单，因此示例中的https://nataliecardot.com/seattle-scoops/状态从未设置为true。结果，当单击菜单项时，没有任何要更新的内容-menuIsOpen仍然为假。

要修复，您需要使父组件的状态与菜单的menuIsOpen状态保持最新。 （图书馆的作者isOpen）。我确定您可以使用钩子执行此操作，但是我没有经验，也不确定如何执行此操作。不过，这是一个示例类版本。

has posted a few examples of this