Реагируйте: как предотвратить экранирование в data-attribute - PullRequest
Новая
       7

Реагируйте: как предотвратить экранирование в data-attribute

0 голосов
/ 01 марта 2019

У меня есть JSON, который выглядит следующим образом: {"id": "xyz", "height": 1024, "width": 1024}, который я хотел бы иметь в атрибуте данных, например: 

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

но когда я использую реагировать, он экранируется от строки, как показано ниже: 

<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 после?

1 Ответ

0 голосов
/ 01 марта 2019

Атрибут dangerouslySetInnerHTML точно используется для подобных сценариев. 

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

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