如何在React中將HTML字符串轉換為虛擬DOM？

Question

我希望能夠通過dangerouslySetInnerHTML我插入到React組件中的原始HTML字符串，並將其合並到虛擬DOM中。 有沒有辦法做到這一點？

例如，如果我有：

<Component dangerouslySetInnerHTML={{__html: htmlFromServer}}></Component>

如何讓htmlFromServer進入虛擬DOM？ 謝謝！

Answer 1

Facebook的React Magic部分可以滿足您的需求：

https://github.com/reactjs/react-magic

Answer 2

您可以使用DOMParser本機執行此操作。

例如：

let doc = new DocParser().parseFromString(htmlFromServer, 'text/html'),
    body = doc.querySelector('body'),
    div = document.createElement('div');

div.textContent = 'You DOM manipulator, you.';
body.appendChild(div);

return <Component dangerouslySetInnerHTML={{__html: body.innerHTML}}></Component>;