You can use property dangerouslySetInnerHTML, like this
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | const Component = React.createClass({ iframe: function () { return { __html: this.props.iframe } }, render: function() { return ( <div> <div dangerouslySetInnerHTML={ this.iframe() } /> </div> ); } }); const iframe = '<iframe src="https://www.example.com/show?data..." width="540" height="450"></iframe>'; ReactDOM.render( <Component iframe={iframe} />, document.getElementById('container') ); |
1 2 3 | <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script> <div id="container"></div> |
If you like this question & answer and want to contribute, then write your question & answer and email to freewebmentor[@]gmail.com. Your question and answer will appear on FreeWebMentor.com and help other developers.
