Question

我正在尝试在React应用程序中包含Foundation下拉菜单。但是，当我尝试添加下拉菜单的常规代码时，下拉功能不起作用，并且下拉菜单项全部自动显示。我也收到错误：

未捕获TypeError：$（...）。foundation不是函数在Constructor.componentDidMount（eval at

以下是我的代码。非常感谢。

var React = require('react');
var $ = require('jQuery');

var Nav = React.createClass({
  componentDidMount: function () {
    $(document).foundation();
  },
  render: function () {
    return(
      <div>
        <div className="off-canvas-wrapper">
          <div className="off-canvas-wrapper-inner" data-off-canvas-wrapper>
            <div className="off-canvas-content" data-off-canvas-content>
              <div className="title-bar show-for-small-only">
                <div className="title-bar-left">
                  <button className="menu-icon" type="button" data-open="mobile-menu"></button>
                  <span className="title-bar-title">MENU</span>
                </div>
              </div>
              <nav className="top-bar nav-desktop">
                <div className="wrap">
                  <div className="top-bar-left">
                    <h5 className="site-logo">Insurance</h5>
                  </div>

                  <div className="top-bar-right">
                    <ul className="menu menu-desktop dropdown" data-dropdown-menu>
                      <li>
                        <a href="#">Linkedin</a>
                        <ul className="menu">
                          <li><a href="#">StackOverflor</a></li>

                        </ul>

                      </li>
                      <li><a href="#">Facebook</a></li>
                      <li><a href="#">FAQ</a></li>

                    </ul>
                  </div>
                </div>
              </nav>
            </div>
          </div>
        </div>
      </div>
    );
  }
});


module.exports = Nav;

Answer 1

您是否在“app.js”文件中导入了“foundation-sites”。？

React中的Foundation下拉菜单

1 个答案: