Question

我正在尝试使用ReactDOM.createPortal（）显示表单。第一次运行正常。但是，如果我关闭并尝试再次打开-它不会显示。无错误消息-无。注意“ main-win”和创建的div是同级。这是正确的方法吗？

class MyForm extends Component {
    constructor(props) {
        super(props);
        this.state = {
            el : document.createElement('div'), 
            divid : Math.floor(Math.random() * 1000000000)
        }
    }
    componentDidMount() {
        document.getElementById('main-win').style= "display:none"
    }
    componentWillUnmount() {
        document.getElementById('main-win').style= "display:block"  
    }
    handleClose(){
        var element = document.getElementById(this.state.divid)
        element.parentNode.removeChild(element)
        document.getElementById('main-win').style= "display:block"
    }
    render(){
        return(
              <div id={this.state.divid} className="form-display">
                  <Theform /> // details removed
              </div>
              )
    }

}

Answer 1

上面的答案在这里https://github.com/reactjs/reactjs.org/issues/272 MyForm是孩子，将其设置为链接建议即可解决此问题。

在React构造函数中document.createElement（'div'）静默失败

1 个答案: