获取URL参数

308 阅读1分钟
方法一: 使用 URLSearchParams。不兼容IE,但可以安装 url-search-params-polyfill 垫片。

/** * 获取当前路由参数 * @param name 参数名称 * @returns {string | object} 指定参数名称时返回参数值;未指定参数名称时返回全部参数对象,链接无参数时返回空对象 {} */export function getURLParams (name) {  const search = location.search.substr(1)  const urlSearchEntries = new URLSearchParams(search).entries() // URLSearchParams不兼容IE  const params = Object.fromEntries(urlSearchEntries)  // 转化 URL 参数  const transParams = _.mapValues(params, (value) => {    let tempValue = value    try {      tempValue = JSON.parse(value)    } catch (error) {      // 转化异常则直接使用初始值    }    return tempValue  })  if (name && typeof name === 'string') {    return transParams[name] || ''  } else {    return transParams  }}
方法二: 无兼容性问题
/** * 获取当前路由参数 * @param name 参数名称 * @returns {string | object} 指定参数名称时返回参数值;未指定参数名称时返回全部参数对象,链接无参数时返回空对象 {} */
export function getURLParams (name) {  const params = {}  if (location.search.indexOf('?') !== -1) {    const searchGroup = location.search.substring(1).split('&')    for (let i = 0; i < searchGroup.length; i++) {      const key = searchGroup[i].split('=')[0]      let value = decodeURIComponent(searchGroup[i].split('=')[1])      try {        value = JSON.parse(value)      } catch (error) {        // 转化异常则直接使用初始值      }      params[key] = value    }  }  if (name && typeof name === 'string') {    return params[name] || ''  } else {    return params  }}

方法三: 正则,这是非常中规中举的一种方法,重点是要求我们要懂正则表达式。
function queryURLParams(url) {    let pattern = /(\w+)=(\w+)/ig; //定义正则表达式    let parames = {}; // 定义参数对象    url.replace(pattern, ($, $1, $2) => {      parames[$1] = $2;    });    return parames;}