【问题标题】:How to open active menu when user visit manually url用户手动访问网址时如何打开活动菜单
【发布时间】:2020-07-21 19:29:42
【问题描述】:

我认为问这个问题可能很愚蠢,但相信我,我是 React 的新手。实际上,我正在开发具有不同可折叠菜单的应用程序。例如,当我单击菜单时,下拉菜单显示当用户手动复制链接并放入浏览器时我想要实现的目标,然后我想显示特定的菜单。有人可以帮助我如何实现这一目标。

代码

menus.map((item, index) => (
                  <UnlockAccess
                    currentUser={userType || null}
                    roles={item.roles}
                    key={index}
                  >
                    <div key={index}>
                      <p
                        onClick={() => {
                          this.RouteTo(`/${item.url}`);
                          this.toggle(item.id);
                        }}
                        className={`element ${this.state[item.activeTab]}`}
                      >
                        <span
                          className={
                            collapse === item.id ? "fa fa-minus" : "fa fa-plus"
                          }
                          key={index}
                        ></span>
                        <p className={this.state[item.activeTab]}>
                          {item.name}
                        </p>
                      </p>
                      {collapse === item.id ? (
                        <div className="prop-child">
                          <ul>
                            {item.children.map((item, index) => (
                              <li
                                key={index}
                                className={this.state[item.activeTab]}
                                onClick={() =>
                                  this.setState({ collapse: item.itemId }, () =>
                                    this.toggle(item.itemId)
                                  )
                                }
                              >
                                <Link
                                  onClick={() => this.RouteTo(`/${item.url}`)}
                                  to={item.url}
                                  className={this.state[item.activeTab]}
                                >
                                  {item.name}
                                </Link>
                              </li>
                            ))}
                          </ul>
                        </div>
                      ) : null} 



toggle = (id) => {
    if (!this.state.collapse || id !== this.state.collapse) {
      this.setState({
        collapse: id,
      });
    }
  };

【问题讨论】:

    标签: javascript reactjs ecmascript-6 react-redux react-router


    【解决方案1】:

    只需检查您班级的 componentDidMount 中的 url 参数。然后打开你要打开的菜单。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2015-09-10
      • 2014-09-09
      • 1970-01-01
      相关资源
      最近更新 更多