Javascript “移动菜单切换”按钮将页面移动到页面顶部

我用移动版本创建了这个导航栏组件

但是，当我点击手机上的“功能表/关闭”按钮时，切换会起作用，但会将页面移到顶部。 有人知道我该如何预防吗

var MobileMenu = React.createClass({
      getDefaultProps: function(){
        return {
            isOpen: false
        };
      },
      openForm: function(){
            window.open('http://localhost:8080.com/form', '_blank', 'location=yes,height=570,width=520,scrollbars=yes,status=yes')
        },
      render: function(){
        if (this.props.isOpen){
        return (
            <div className="navMenuButtons">
              <NavLink to="/" className="navMenuButton">HOME</NavLink>
              <NavLink to="/about" className="navMenuButton">ABOUT</NavLink>
              <NavLink to="/faq" className="navMenuButton">FAQ</NavLink>
              <div className="margin-auto">
                <NavLink className="navButton applyButton" onClick={this.openForm}>
                 APPLY
                </NavLink>
              </div>
            </div>
        )
      }
        return null;
      }
    });
    var NavBar = React.createClass({
      getInitialState: function()
            {
                return {
                    isOpen: false
                };
            },
          toggleMenu: function(){
          this.setState({isOpen: !this.state.isOpen});
        },
          openForm: function(){
                window.open('http://localhost:8080/form', '_blank', 'location=yes,height=570,width=520,scrollbars=yes,status=yes')
            },
      render: function(){
          var mobileMenuClass = this.state.isOpen ? 'navBar navBarOpen cl-effect-21' : 'navBarClose navBar cl-effect-21';
          var mobileButton = this.state.isOpen ? 'CLOSE' : 'MENU';
          return (
            <div>
                <div className={mobileMenuClass}>
                <a href="#" className="mobile_toggle">
                  <div className="toggle_labels">
                    <div onClick={this.toggleMenu}className="menu navButton">{mobileButton}</div>
                  </div>
                </a>
              <div className="navMenuButtons_desk">
                <NavLink to="/" className="navMenuButton">HOME</NavLink>
                <NavLink to="/about" className="navMenuButton">ABOUT</NavLink>
                <NavLink to="/faq" className="navMenuButton">FAQ</NavLink>
                <div className="button_right">
                  <NavLink target="_blank" className="navButton applyButton" ><div onClick={this.openForm}>
                    APPLY</div>
                  </NavLink>
                </div>
              </div>
              <MobileMenu isOpen={this.state.isOpen} onToggle={this.toggleMenu} />
              </div>
            </div>
          );
        }
    });
    var App = React.createClass({
      render: function(){
        console.log(this.props.location.pathname);
        const location = this.props.location;
        return (
          <div>
            <NavBar />
            { this.props.children }
            <Footer />
          </div>
        );
      }
    });

var MobileMenu=React.createClass({
getDefaultProps:function（）{
返回{
伊索彭：错
};
},
openForm:function（）{
打开窗户http://localhost:8080.com/form“，”“空白”，“位置=是，高度=570，宽度=520，滚动条=是，状态=是”）
},
render:function（）{
如果（此.props.isOpen）{
返回(
家
关于
常见问题
申请
)
}
返回null；
}
});
var NavBar=React.createClass({
getInitialState:函数（）
{
返回{
伊索彭：错
};
},
切换菜单：函数（）{
this.setState（{isOpen:！this.state.isOpen}）；
},
openForm:function（）{
打开窗户http://localhost:8080/form“，”“空白”，“位置=是，高度=570，宽度=520，滚动条=是，状态=是”）
},
render:function（）{
var mobileMenuClass=this.state.isOpen？“导航栏导航栏cl-effect-21”：“导航栏关闭导航栏cl-effect-21”；
var mobileButton=this.state.isOpen？'CLOSE'：'MENU'；
返回(
家
关于
常见问题
申请
);
}
});
var App=React.createClass({
render:function（）{
log（this.props.location.pathname）；
const location=this.props.location；
返回(
{this.props.children}
);
}
});

这可能是锚定标记的问题，而不是React。尝试在

href

上设置

javascript:void（0）

，或者删除#。

这可能是锚定标记的问题，而不是React。尝试在

href

上设置

javascript:void（0）

，或删除#