Question

我有一个看起来像这样的JSON {“ id”：“ xyz”，“ height”：1024，“ width”：1024}我希望在数据属性中拥有它：

<div data-command='{"id":"xyz","height":1024,"width":1024}'></div>

但是当我使用react时，它会如下所示转义字符串：

<div data-command='{&quot;id&quot;:&quot;xyz&quot;,&quot;height&quot;:1024,&quot;width&quot;:1024}'></div>

我使用此代码生成元素

    React.createElement("div",
{ "data-command" : JSON.stringify({ "id":"xyz", "height":1024, "width":1024 }), null)

有人知道我如何在不进行转义的情况下获取JSON吗？

如果不可能的话，如何在javascript中将其转换回原来的格式，以便以后可以使用JSON.parse？

Answer 1

'dangerouslySetInnerHTML'属性正是用于这种情况。

createMarkup() {
    return {__html: `<div data-command='{"id":"xyz","height":1024,"width":1024}'></div>`};
}

render() {
    return (
        <div dangerouslySetInnerHTML={this.createMarkup()}>
        </div>
    );
}

React：如何防止数据属性转义

1 个答案: