Javascript 在reactstrap中重定向后,滚动不起作用
我正在React中开发一个简单的类似petshop的应用程序。它的主要功能是管理文章。最近,我在尝试在点击某个按钮时将客户端重定向到另一个路由后,遇到了一些奇怪的行为 所以我在reactstrap的模态窗口中有一个按钮定义Javascript 在reactstrap中重定向后,滚动不起作用,javascript,reactjs,react-router,Javascript,Reactjs,React Router,我正在React中开发一个简单的类似petshop的应用程序。它的主要功能是管理文章。最近,我在尝试在点击某个按钮时将客户端重定向到另一个路由后,遇到了一些奇怪的行为 所以我在reactstrap的模态窗口中有一个按钮定义 render() { <Modal isOpen={this.state.modalOpen} toggle={this.toggleModal.bind(this)} ... <Button onClick={this.addNewArticle.bind(
render() {
<Modal isOpen={this.state.modalOpen} toggle={this.toggleModal.bind(this)}
...
<Button onClick={this.addNewArticle.bind(this)}>Add</Button>
...
问题是,重定向完成后,我无法用鼠标滚轮滚动文章(调用window.scrollByLines(1)
在devtools中实际工作)。整页都固定好了。在我完全刷新整个页面(F5)后,一切似乎都恢复正常,并且再次启用了滚动。我尝试在render()函数中用返回的
标记替换this.props.history.push,但没有效果
我怎样才能防止那个奇怪的滚动锁
编辑:添加了有关模式窗口的详细信息。
似乎toggleModal()
没有按预期工作,因为它在重定向后将以下CSS类留在DOM中:
.modal打开{
溢出:隐藏;
}
这是reactstrap中的一个已知错误-
现在,我已经修改了addNewArticle代码,手动删除有问题的元素,问题就消失了
。。。
.然后(文章=>{
...
this.toggleModal();
document.querySelector('body').classList.remove('modal-open');
this.props.history.push('/');
});
React与滚动无关。您必须有DOM或CSS问题(或者可能有浏览器错误?是否在所有浏览器中都会发生这种情况?)。如果我们能看到你的页面/组件是如何构造的,那将很有帮助。如果你检查你希望滚动的东西,它是否有任何特殊的CSS样式使它不可滚动,也许?很好的发现。如果你仍然不确定如何修复,一定要在你的帖子中添加更多细节,比如你是如何使用模态的。也许你应该给自己的问题贴一个答案;它肯定会帮助其他人了解你的解决方法。