简单的门户组件呈现<div id =“undefined”> </div>

时间:2017-02-25 12:51:09

标签: javascript reactjs dom react-dom

我根据此网站上的教程创建了一个简单的门户网站:How to create a React Modal(which is append to `<body>`) with transitions?。简单门户的代码是:

var Portal = React.createClass({
  render: () => null,
  portalElement: null,
  componentDidMount() {
    var p = this.props.portalId && document.getElementById(this.props.portalId);
    if (!p) {
      var p = document.createElement('div');
      p.id = this.props.portalId;
      document.body.appendChild(p);
    }
    this.portalElement = p;
    this.componentDidUpdate();
  },
  componentWillUnmount() {
    document.body.removeChild(this.portalElement);
  },
  componentDidUpdate() {
    React.render(<div {...this.props}>{this.props.children}</div>, this.portalElement);
  }
});

但是,不是将上面创建的div渲染为父级,而是渲染带有未定义id的div作为父级。我想知道为什么会这样,我怎么能删除它。谢谢

1 个答案:

答案 0 :(得分:0)

我认为您需要将portalId作为道具组件的道具传递。现在还没有定义。