使用JavaScript动态更新React App

My React应用程序进行第三方服务调用，以加载需要通过指定的CSS选择器注入DOM的内容。它可以位于页面的任何位置。我该如何将这些内容注入指定选择器的React应用程序，以确保虚拟DOM得到更新并保持不变？使用JavaScript动态更新React App

成像，这是我希望注入阵营的应用程序的第三方响应对象：

var response={selector:'#someSel',html='<div>Hello from third party</div>'}

我有些新反应世界，但我熟悉的虚拟DOM动态地更新应用程序时的挑战。我希望React在前端进行更新以注入此内容 - 当React应用程序已经更新所有组件时。

请注意，我可以修改应用程序，但我需要得到它的工作。

来源

2017-05-08 Vad

你试过了什么？请显示，以便我们可以帮助解决您发现的任何问题 –

我为自己的问题添加了更多信息，但我没有尝试，因为找不到任何问题答案。 – Vad

您应该运行ajax调用以获取'componentDidMount（）'函数中的外部数据，然后在收到数据时设置您的状态 –

我认为dangerouslySetInnerHTML可能是你要找的。

The official React docs使用以下示例。

function createMarkup() { 
    return {__html: 'First &middot; Second'}; 
} 

function MyComponent() { 
    return <div dangerouslySetInnerHTML={createMarkup()} />; 
}

当然，你的情况，你会在createMarkup()与您的第三方HTML内容设置__html。

来源

2017-05-08 16:44:45 speckledcarp

但是，这是React Component方式，不是吗？我如何知道CSS选择器，然后更新React Virtual DOM？ – Vad

我不太清楚你的意思。为什么需要基于CSS选择器进行更新？地道React将所有必要的信息作为道具渲染一个组件，或者将其作为本地状态来维护。 – speckledcarp

因为这是第三方服务如何将内容传递到我的应用程序。 – Vad

使用JavaScript动态更新React App

回答

相关问题