在另一个HTML页面

Question

我使用Visual Studio 2017的React-Redux SPA模板创建了一个新项目

现在＆＃34; react-app＆＃34; div在Index.cshtml中添加。 如果我想在另一个应用程序（简单的HTML页面）中再次重用相同的<div>并重用相关的脚本该怎么办？ 这是test.html页面上的内容

  

脚本

<base href="" />
<link rel="stylesheet" href="dist/vendor.css" asp-append-version="true" />
<link rel="stylesheet" href="dist/site.css" asp-append-version="true" />
<script type="text/javascript" src="dist/vendor.js" asp-append-version="true"></script>
<script type="text/javascript" src="dist/main-client.js" asp-append-version="true"></script>

  

体

<div id="react-app" asp-prerender-module="ClientApp/dist/main-server"  data-content="{&quot;formID&quot;:7}">Loading...</div>

在浏览器中运行此页面表示initialReduxState为undefined。

那么在不需要MVC Razor视图的情况下，将React组件及其相关脚本轻松嵌入到另一个页面的最佳实践是什么？

谢谢！

Answer 1

事实证明，服务器端预呈现正在启动initialReduxState，在这种情况下（简单的HTML页面），服务器端预呈现不起作用，所有像asp-prerender-module这样的标记助手都没用，应该被删除。

所以为了让main-client.js文件正常工作，我修改了boot-client.ts文件

这

const initialState = (window as any).initialReduxState as ApplicationState;

到

const initialState = (window as any).initialReduxState as ApplicationState || { form: {}, routing: { location: null }};