C# 如何根据来自ASP.NET Core的路由在React中呈现不同的内容？

我正在为多个商店的网站工作。他们的地址如下：

https://address/Store1/

，

https://address/Store2/

等。 我想在后端根据URL参数（

Store1

，

Store2

）进行路由分离，以呈现不同的React组件，或者只是以某种方式将不同的数据返回到前端

到目前为止，我已经：

Startup.cs

app.UseEndpoints(endpoints =>
{
    endpoints.MapControllerRoute(
        name: "store",
        pattern: "Store/{action=Index}",
        defaults: new { controller = "Store" }
    );

    endpoints.MapControllerRoute(
        name: "default",
        pattern: "{controller}/{action=Index}/{id?}"
    );
});

public ActionResult Index() {
     return Json("Please specify a store");
}

public ActionResult Store1() {
     return View("Store1");
}

public ActionResult Store2() {
     return View("Store2");
}

StoreController.cs

app.UseEndpoints(endpoints =>
{
    endpoints.MapControllerRoute(
        name: "store",
        pattern: "Store/{action=Index}",
        defaults: new { controller = "Store" }
    );

    endpoints.MapControllerRoute(
        name: "default",
        pattern: "{controller}/{action=Index}/{id?}"
    );
});

public ActionResult Index() {
     return Json("Please specify a store");
}

public ActionResult Store1() {
     return View("Store1");
}

public ActionResult Store2() {
     return View("Store2");
}

其中

Store1

和

Store2

是反应组件（

Store1.tsx

，

Store2.tsx

）。但在本例中，程序希望视图是

.html

/

.cshtml

文件

---

最后一个问题是如何根据ASP.NET Core的路由在React中呈现不同的内容？

好吧，既然这是SPA，您就错了

您不能（在任何情况下，您都不希望）让.net服务器获取普通的小型组件

您无法避免客户端路由，事实上，您正在制作的应用程序应该是一个完整的、仅基于客户端反应的SPA，并在客户端添加路由

您遇到的问题是，当您要求服务器从应用程序中输入“/Stores/1”时，例如导航链接，我想一切都很顺利，因为所有组件都捆绑在交付的SPA应用程序中。 但是，当您尝试共享链接，或从新选项卡直接点击“www.host.com/stores/1”时，服务器将不知道如何处理它。。。您的水疗服务从1点开始，并且有1个起始状态

您需要做的是在客户端应用程序上添加路由，即：

• =>返回SPA应用程序
• =>应再次返回相同的SPA，但具有新的启动状态

“在.net上处理路由”应仅指“当有人直接请求.net服务器时，如何处理详细路由，而不是仅为同一入口点提供服务，而不是从应用程序客户端路由器（指示渲染内容）中导航

本质上，由于这是一个SPA，“除根路由之外的所有路由都应提供相同的SPA，但具有不同的起始状态”

---

我最近实现了一个react前端，带有一个.net核心后端（API和SPA服务）上述方法非常有效！

您正在寻找客户端路由吗？您可以使用各种与React兼容的路由库来实现这一点。您可以从页面输出JavaScript，并通过该库更改React应用程序的呈现方式。您可以使用一个变量对其进行初始化，该变量表示要去哪里。这取决于您是否使用路由或其他方法否则具体怎么做。@juunas，我想在ASP.NET中进行路由这是一个spa，对吗@AN00？@SamiKuhmonen但是，如果事先不知道将调用哪个操作，您如何从StoreController获取该变量？如果我想从同一页面中导航到Store1和Store2，这是有意义的，但我希望能够正如您所说，将它们作为单独的页面访问，直接从一个新选项卡点击它们。因此，在这种情况下，路由应该在后端完成，不是吗？很好，不是rly…因为我们谈论的“路由”类似于，即：rootURL=>return app.js和wait for user Stores/1=>return app.js，使用javascript端、客户端路由器和推送”Stores/1“react router Some/Other/Uri=>return app.js，让javascript在react router中推送“Some/Other/Uri”这是一个简单的想法。如果route“/”传递app.js并等待，那么“Stores/1”的.net控制器应该返回相同的spa，只需在客户端路由器中推送路由即可