如何将现有的 <IMG> 元素 (HTMLImageElement) 附加到 Facebook React.js 组件？

Question

我有一个用数据 uri 生成的 IMG DOM 元素。如何将它附加到 React.js“虚拟 DOM”？

当我尝试以下操作时：

myImgComponent = React.createClass({

  getInitialState: function() {
    slowGenerateImage((function(_this) {
      return function(img) { /* img is an HTMLImageElement */
        return _this.setState({
          image: img
        });
      };
    })(this));

    return {image: null};
  },

  render: function() {
    return div(
      {}, 
      this.state.image /* image is a raw HTMLImageElement */
    );
  }
});

我收到以下错误：

Invariant Violation: traverseAllChildren(...): Encountered an invalid child; DOM elements are not valid children of React components. 

Answer 1

你可以只渲染<img src={this.state.img.src}/>吗？或者甚至slowGenerateImage只是生成src，而不是创建元素，然后您可以直接传递它。