Javascript 带有react引导的下拉菜单在构建静态文件中工作,但在与web服务器一起使用时不起作用
我有一个简单的页面,内置react、react引导和react迷你路由器 我在react引导示例中使用了相同的代码来导航下拉列表:Javascript 带有react引导的下拉菜单在构建静态文件中工作,但在与web服务器一起使用时不起作用,javascript,reactjs,react-bootstrap,Javascript,Reactjs,React Bootstrap,我有一个简单的页面,内置react、react引导和react迷你路由器 我在react引导示例中使用了相同的代码来导航下拉列表: render: function() { var userName = 'Superman'; return ( <Navbar brand="React-Bootstrap"> <Nav> <NavItem
render: function() {
var userName = 'Superman';
return (
<Navbar brand="React-Bootstrap">
<Nav>
<NavItem eventKey={1} href="/">Home</NavItem>
<NavItem eventKey={2} href="/About">About</NavItem>
<NavDropdown eventKey={3} title={userName} id="basic-nav-dropdown" onClick={this.userNameClick}>
<MenuItem eventKey="1">Action</MenuItem>
<MenuItem eventKey="2">Another action</MenuItem>
<MenuItem eventKey="3">Something else here</MenuItem>
<MenuItem divider />
<MenuItem eventKey="4">Separated link</MenuItem>
</NavDropdown>
</Nav>
</Navbar>
)
}
});
render:function(){
var用户名=‘超人’;
返回(
家
关于
行动
另一个动作
还有别的吗
分离环
)
}
});
当我构建页面并打开索引时,如您所见,菜单中的下拉菜单按预期工作,只是在不导航页面的情况下删除菜单,无论您是在“主页”还是“关于”
但是,当我使用gulp connect或python SimpleHTTPServer在localhost上为页面提供服务时,按下下拉菜单总是将页面更改/导航到“主页”,即使下拉菜单不是链接
这怎么会发生
示例的完整代码可以找到,问题可以通过运行gulp复制,gulp将启动web服务器。更新:问题是react引导和react mini router之间的冲突,您可以在Github问题上看到进度/解决方案 我的临时解决办法是在RouterMixin的handleClick函数中捕获事件
handleClick: function(evt) {
var dropdownevt = (evt.path[0].id === 'acc-dropdown');
if (url && self.matchRoute(url.pathname) && !dropdownevt) { ...