如何在Reaction JS中将Html字符串呈现给组件
我有一个作为<div>Hello</div>
字符串的HTML内容,我只想在Reaction组件中将其呈现为HTML,而不使用innerHTML方法和默认的反应,如DangerouslySetInnerHTML。请让我知道是否有任何完美的替代方案将有效地工作。我只是不想使用任何类似html-to-reaction的包。是否可以使用Reaction Render中的任何其他默认方法来实现此目的?
export default class sampleHTML extends React.Component {
constructor(props) {
super(props);
this.state = {
currentState: "",
};
}
componentDidMount() {
this.setState({currentState :`<div>Hello</div>` });
}
render() {
return (
<div id="container">{this.state.currentState}</div>
)
};
};
Sample Link
我需要将标记呈现为非字符串
解决方案
您可以在Reaction中使用DangerouslySetInnerHTML。 有关更多详细信息,请使用以下链接: https://reactjs.org/docs/dom-elements.html
export default class sampleHTML extends React.Component {
constructor(props) {
super(props);
this.state = {
currentState: "",
};
}
componentDidMount() {
this.setState({currentState: <div>Hello</div> });
}
this.createMarkup() {
return {__html: this.state.currentState};
}
render() {
return (
<div id="container" dangerouslySetInnerHTML={createMarkup()}></div>
)
};
};
相关文章