Razor Pages中Url.PageLink路由异常及JS动态路径问题

• 未给Project.cshtml设置@page "{id}"时，该页面采用默认无参数路由，直接对应路径/Project，因此Url.PageLink("Project")能直接生成匹配该路由的标准链接。
• 添加@page "{id}"后，该页面的路由模板变为必须携带id参数的规则。此时调用Url.PageLink("Project")未传入必填的id参数，系统无法匹配到符合要求的路由，就会触发回退机制：通过查询字符串?page=%2FProject（%2F是/的URL编码）指定目标页面，本质是绕过路由匹配逻辑，直接告知系统要加载Project页面。

要实现类似a.href = '@Url.PageLink("Project")'+'/123';的需求，可参考以下方案：

方案1：生成基础路径后拼接参数 #

先获取页面的路由基础前缀，再用JS动态拼接参数：

<script>
    // 生成带占位符的路径，移除占位符得到基础路径
    const basePath = '@Url.PageLink("Project", new { id = "temp" })'.replace('temp', '');
    const projectId = 123;
    document.querySelector('a').href = basePath + projectId;
</script>

方案2：直接使用已知路由前缀 #

如果明确页面的路由前缀，可直接写基础相对路径，再拼接参数：

<script>
    const projectId = 123;
    document.querySelector('a').href = '/Project/' + projectId;
</script>

方案3：利用路由模板生成可替换路径 #

用Url.RouteUrl生成带占位符的路由模板，再替换为实际参数：

<script>
    const routeTemplate = '@Url.RouteUrl("Project", new { id = "{id}" })';
    const projectId = 123;
    document.querySelector('a').href = routeTemplate.replace('{id}', projectId);
</script>

内容的提问来源于stack exchange，提问作者smaks88