将动态 HTML 作为值属性呈现给 React.js 中的 TextArea 字段答案

【问题标题】：Render dynamic HTML as a value attribute to TextArea field in React.js将动态 HTML 作为值属性呈现给 React.js 中的 TextArea 字段
【发布时间】：2017-12-20 19:34:54
【问题描述】：

我有一个简单的 textarea 标签。

<textarea value={this.state.currentValue} disabled={this.props.readOnly}/>

我正在尝试使用 dangerouslySetInnerHTML 但不确定如何在 TextArea 标记的 value 属性内正确设置。我知道并使用过 dangerouslySetInnerHTML，它在与 div、body 标签一起使用时效果很好。

 renderHtml: function(){
        return (
            dangerouslySetInnerHTML={{__html : this.state.currentValue}} 
        );
    }
   <TextArea value={this.renderHtml()} disabled={this.props.readOnly}/>

【问题讨论】：

您是否要让 textarea 呈现 HTML？或者只是让它显示代码。换句话说，如果 html 是这样的 <span>hello world</span>，你想只看到 hello world 还是实际的标记？
我想让 textarea 标签呈现 HTML。它的价值来自于 REST api。所以我想看看实际的标记。

标签： javascript html reactjs innerhtml

【解决方案1】：

看起来对于任何 HTML 元素，只允许字符串作为值。解决方案是使用富文本所见即所得编辑器。

【讨论】：