为 URL 创建 RegEx 控件

Question

我当前的 Web 应用程序有问题。确实，当我放置当前链接时：https://localhost:44311/#shop，我的页面显示完美。这是一张图片：

但是当我尝试将我的 URL 更改为： https://localhost:44311/#/ ，以验证重定向的控制时，显示的内容变成了相同的内容，这里是发生了什么的图片：

目前，我所有的 ajax 调用都被一次又一次地调用（无限循环）。

我正在尝试为#/ 添加控制正则表达式，并尝试尊重#/xxxx/xxxxx。但没有成功。如果你能帮助我，那就太好了！ 这是我管理加载页面的 JS：

var ui = {
   controller: {
       page: {}
   },
   component: {
       category: null
   }
};
ui.controller.pageLoad = function (hash = null) {
   if (hash === null) {
       hash = window.location.hash;
       if (hash.length < 2 || hash[0] !== "#") {
           hash = "/shop";
       }
   } else if (hash.length < 2 || hash[0] === "#" && hash[1] === '/') { // add control regex for #/, must respect #/xxxx/xxxxx
       hash = "/shop";
   }

   $.get(hash.substring(1), function (data) {
       ui.controller.page = null;
       $("#content").html(data);
   }).fail(function (error) {
       $.get("/Home/Error?status=" + error.status, function (data) {
           ui.controller.page = null;
           $("#content").html(data);
       });
   });
};

Answer 1

您可以创建一个isValidHash 函数，并在您的if 语句中使用它：

function isValidHash(hash) {
  return typeof hash === "string" && /^#(\/[a-z0-9-]+)+$/.test(hash);
}

function test(v) {
  console.log(`'${v}' is ${isValidHash(v) ? '' : 'NOT '}valid`);
}

test(null);            // NO - not a string
test('#');             // NO - too short
test('#shop');         // NO - no slash
test('#/shop');        // YES
test('#/shop/item-9'); // YES