相关疑难解决方法(0)

是否可以从外部源获取HTML/JSX内容并在React中动态呈现它？在我们的例子中,我们想从Wordpress API获取内容并在客户端和服务器上呈现它(我们使用的是NextJS)

因此,Wordpress API返回一个JSON响应,其中包含一个内容属性,该属性是一个HTML/JSX字符串.内容看起来像这样.

{
    content: "<div><Slider imageCount="5" galleryID="1"></Slider><span>This is an image gallery</span></div>"
}

因此,正如您所看到的,它将是HTML和React组件/ JSX的混合,表示为字符串

我会使用Axios来调用内容(使用NextJS的getInitialProps()方法在服务器和客户端上),然后我需要渲染它,但我是新的反应,我可以看到一些问题.

1)在React中,JSX是在构建时编译的,而不是运行时,我看不出如何绕过它(例如,使用$ compile服务在Angular中会很容易).

2)由于我们不知道Wordpress的内容将使用哪些组件,我们必须在页面顶部导入它们中的每一个,内容可能包含一个组件,或者它可能包含一个组件,谁知道？.

现在,我认为这是不可能的,这意味着我们必须重新考虑使用React,但我真的希望有人有答案.

真的很感激任何帮助.

我正在使用 React JS + webpack。我需要解决的一般情况是动态加载未与主应用程序捆绑的 React 组件。一种可以独立于主应用程序开发，然后由应用程序动态加载的可插拔组件，无需重建整个应用程序。

具体案例如下。

我有两个完全分离的模块（即使用不同的 package.json 和 webpack.config.js 构建）：

• 这 MainApp
• 一些 Component

我需要实现以下行为：

1. 已MainApp加载并初始化的页面。
2. MainApp动态查找包含的 .js 文件的 url Component（例如，通过向网络服务器发出 GET 请求）。
3. MainApp加载 .js 文件Component并将其包含到页面中<script>
4. MainAppComponent在渲染时使用加载。

在 react js + webpack 中可以使用这种用例吗？