获取url动态参数

不包含 hash（即 #）的 URL

const queryString = window.location.search;
const searchParams = new URLSearchParams(queryString);

const cdlParams = {};

for (const [key, value] of searchParams.entries()) {
  if (key.startsWith('cdl_')) {
    cdlParams[key] = value;
  }
}

console.log(cdlParams); // 输出带有 cdl_ 前缀的参数及其对应的值

包含 hash（即 #）的 URL

 searchParams (mark) { // 取url动态参数
      const url = window.location.href;
      const queryString = url.split('?')[1];
      const cdlParams = {};
      if (queryString) {
        const searchParams = new URLSearchParams(queryString);
        for (const [key, value] of searchParams.entries()) {
          if (key.startsWith(mark)) {
            cdlParams[key] = value;
          }
        }
      }
      return cdlParams;
 },

使用：

 created () { 
    this.biSearch = this.searchParams('cdl_')
    console.log(this.biSearch);
  },

注：window.location.search 只会返回问号后的查询字符串，而不包括 # 及其后面的内容，所以使用 window.location.href 来获取完整的 URL，通过split 分割获取？后字符串

释： const searchParams = new URLSearchParams(queryString)

是使用 JavaScript 的内置 URLSearchParams 对象来创建一个包含查询字符串参数的实例.

const [key, value] of searchParams.entries()

是 JavaScript 中的解构赋值语法，用于从一个数组或类数组对象中提取值，并将它们赋给变量。

在这个特定的语句中，searchParams.entries() 返回一个迭代器对象，该对象包含查询字符串中的每个键值对。每个键值对都是一个具有两个元素的数组，第一个元素是键，第二个元素是值。

通过使用解构赋值语法，我们可以将键值对数组的第一个元素赋给变量 key，将第二个元素赋给变量 value。这样，我们就可以在循环中访问每个键和值，并对它们进行操作。

猜你喜欢