如何使用ReactJS组件将XML添加到DOM

Question

I want to put some xml in the DOM so that it can be accessed by another Component. But when I try to render it, I keep getting prop unknown errors, such as:

warning.js:36 Warning: Unknown prop colour on <category> tag. Remove this prop from the element. For details, see https://facebook.github.io/react/warnings/unknown-prop.html

I don't want React to interpret those attributes as props! It's just xml, not a react component!

This is the code I have:

class DefaultToolbox extends Component {
  render() {
    // static xml
    return (
      <xml id="toolbox" style={{display: "none"}}>
        <category name="Logic" colour="#5C81A6" />
        // ... etc etc
      </xml>
    );
  }
}

Answer 1

return (<span dangerouslySetInnerHTML={{ __html: `<xml ..> ... </xml>` }}/>);

有关更多信息： https : //facebook.github.io/react/docs/dom-elements.html#dangerouslysetinnerhtml