asp.net-core - 有没有关于没有刷新页面的asp.net core mvc切换路由的解决方案，比如角度路由重用策略

Question

我只想达到以下结果，切换路由而不刷新页面

补充： 我想保持页面状态

标签： asp.net-coreasp.net-core-mvcasp-net-core-spa-services

Answer 1

可以实现这个功能的局部视图。

这是一个简单的演示供您参考：

家庭控制器：

  public class HomeController : Controller
    {
        public IActionResult Index()
        {
            return View();
        }

        public IActionResult FirstTab(string param)
        {
          return PartialView("_FirstTab",param);
        }

    }

索引.cshtml：

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="/resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
    $(function () {
        $("#tabs").tabs();
    });
</script>
<div id="tabs">
    <ul>
        <li><a href="#tabs-1">Page1</a></li>
        <li><a href="#tabs-2">Page2</a></li> 
    </ul>
    <div id="tabs-1"> 
        @Html.Partial("_FirstTab", "Page1")
    </div>
    <div id="tabs-2">
        @Html.Partial("_FirstTab", "Page2")
    </div>
</div>

_FirstTab.cshtml 局部视图：

@model string

<h1>This is the @Model Tab</h1>
<input id="Text1" type="text" />

测试结果：