Browse Source

Extracted "safe taint" in docs/homepage to align with best practice #4212

main
Bradley Spaulding 10 years ago
parent
commit
e38c477147
  1. 7
      _js/examples/markdown.js
  2. 8
      docs/tutorial.md

7
_js/examples/markdown.js

@ -6,6 +6,9 @@ var MarkdownEditor = React.createClass({
handleChange: function() { handleChange: function() {
this.setState({value: React.findDOMNode(this.refs.textarea).value}); this.setState({value: React.findDOMNode(this.refs.textarea).value});
}, },
rawMarkup: function() {
return { __html: marked(this.state.value, {sanitize: true}) };
},
render: function() { render: function() {
return ( return (
<div className="MarkdownEditor"> <div className="MarkdownEditor">
@ -17,9 +20,7 @@ var MarkdownEditor = React.createClass({
<h3>Output</h3> <h3>Output</h3>
<div <div
className="content" className="content"
dangerouslySetInnerHTML={{ dangerouslySetInnerHTML={this.rawMarkup()}
__html: marked(this.state.value, {sanitize: true})
}}
/> />
</div> </div>
); );

8
docs/tutorial.md

@ -257,14 +257,18 @@ That's React protecting you from an [XSS attack](https://en.wikipedia.org/wiki/C
```javascript{4,10} ```javascript{4,10}
// tutorial7.js // tutorial7.js
var Comment = React.createClass({ var Comment = React.createClass({
render: function() { rawMarkup: function() {
var rawMarkup = marked(this.props.children.toString(), {sanitize: true}); var rawMarkup = marked(this.props.children.toString(), {sanitize: true});
return { __html: rawMarkup };
},
render: function() {
return ( return (
<div className="comment"> <div className="comment">
<h2 className="commentAuthor"> <h2 className="commentAuthor">
{this.props.author} {this.props.author}
</h2> </h2>
<span dangerouslySetInnerHTML={{"{{"}}__html: rawMarkup}} /> <span dangerouslySetInnerHTML={this.rawMarkup()} />
</div> </div>
); );
} }

Loading…
Cancel
Save