【问题标题】:Reactstrap Modal doesn't fade in but fades outReactstrap Modal 不淡入但淡出
【发布时间】:2018-04-15 20:27:41
【问题描述】:

我正在构建一个带有 Reactstrap 登录链接的标题。当用户单击登录链接时,应该会出现一个模式,显示登录的不同选项。这是我的代码:

export default class Header extends Component {
    state = {
        isOpen: false,
        modal: false
    }
    toggle = () => this.setState({ isOpen: !this.state.isOpen })
    toggleModal = () => this.setState({ modal: !this.state.modal })
    render() {
        return (
            <div>
                <Navbar light expand="md">
                    <NavbarBrand href="/">VoteMole</NavbarBrand>
                    <NavbarToggler onClick={this.toggle} />
                    <Collapse isOpen={this.state.isOpen} navbar>
                        <Nav className="ml-auto" navbar>
                            <NavLink href="#" onClick={this.toggleModal}>
                                <NavItem>Login</NavItem>
                            </NavLink>
                        </Nav>
                    </Collapse>
                </Navbar>
                <Modal isOpen={this.state.modal} toggle={this.toggleModal}>
                    <ModalBody>Lorem Ipsum</ModalBody>
                </Modal>
            </div>
        )
    }
}

我遇到的问题是模态仅淡出但不淡入。默认情况下,模态组件将淡入淡出道具设置为true。我尝试使用fade={true} 或仅使用简写fade 手动设置它。它没有解决问题。我尝试设置 modalTransition 和 backgroundTransition 道具来触发淡入淡出效果。它仍然没有工作。有人可以帮忙解决这个问题吗?

【问题讨论】:

    标签: reactjs reactstrap


    【解决方案1】:

    不幸的是,这似乎是 reactstrap 的一个错误。在此处查看开放的 Github 问题:https://github.com/reactstrap/reactstrap/issues/607

    【讨论】:

    • 感谢您的回答。我想知道这个错误是否只发生在 React 16 上?因为文档中的示例运行良好,我假设它使用的是旧版本的 React。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2015-09-16
    • 2017-06-08
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多