Question

我有我的元素：

dangerouslySetInnerHTML: { __html: this.props.html.map(React.renderToStaticMarkup).join('') }

this.props.html是一个React Elements数组（由此方法构建）：

makeOutput(model) {
    return <Key model={model} />;
}

当我在断点处运行上面的代码时，我得到：

> this.props.html.map(React.renderToStaticMarkup).join('')
> "<span>b</span>"

但是，当元素输出到DOM时，显示的所有内容都是[object Object]。有什么理由吗？

Answer 1

This example表明该技术没有问题：

function makeOutput(text) {
  return <Wrapper text={text} />;
}

var Wrapper = React.createClass({
  render() {
    return <div>Wrapping: {this.props.text}</div>
  }
});

var App = React.createClass({
  render() {
    var items = [
      makeOutput("one"),
      makeOutput("two"),
      makeOutput("three")
    ];
    return (
      <div dangerouslySetInnerHTML={{__html: items.map(React.renderToStaticMarkup).join("") }} />
    );
  }
});

React.render(<App />, document.getElementById("container"));

问题必须出在你尚未透露的一些代码中。

危险的setInnerHTML反应打印'[object Object]'

1 个答案: