資訊專欄INFORMATION COLUMN
摘要：以后會不定期把項(xiàng)目中用到的也是我們平時開發(fā)常用的一些方法貼出來，也是一個自我總結(jié)的過程獲取鍵值是我們在項(xiàng)目會經(jīng)常遇到的需求。
以后會不定期把項(xiàng)目中用到的也是我們平時開發(fā)常用的一些方法貼出來，也是一個自我總結(jié)的過程
獲取url鍵值是我們在項(xiàng)目會經(jīng)常遇到的需求。下面是我在項(xiàng)目中封裝的方法，詳細(xì)的說明在代碼都有注釋。
/**
* 獲取url鍵值
* url => [href] | [param]
* 不填參數(shù)則返回JSON 格式所有數(shù)據(jù)
*/
const urlCodeToObj = url => {
let u = url || window.location.href
//判斷url是完整的鏈接還是傳入的參數(shù)
if (RegExp(/^((https|http)?://)/).test(u)) {
//將url中的空格去掉并匹配"?"后面的參數(shù)字符串集合
const search = u.replace(/^s+|s+$/, "").match(/([^?#]*)(#.*)?$/)
if (!search) {
search = {}
}
//把匹配到的字符串以"&"分割變換成數(shù)組形式
let searchHash = search[1].split("&");
let paramObj = {} //鍵值對對象集合
for (let item of searchHash) {
const pair = item.split("=")
if (pair[0]) {
const key = decodeURIComponent(pair[0])
const value = pair[1]
if (value != undefined) {
value = decodeURIComponent(value)
}
}
//判斷轉(zhuǎn)化后的paramObj里面有沒有重復(fù)的屬性
if (key in paramObj) {
if (paramObj[key] instanceof Array) {
//把屬性值變?yōu)閿?shù)組，將另外的屬性值也存放到數(shù)組中去
paramObj[key] = [paramObj[key]]
}
paramObj[key].push(value)
} else {
paramObj[key] = value
}
}
return paramObj
} else {
//返回單個屬性值 string
if (RegExp(/^w+/).test(u)) {
//匹配屬性值,比如http://xxx.com/web/page/prodetail.html?num=200&productID=4690&id=100
//輸入值為 &productID=4690&,然后進(jìn)行匹配.
let reg = new RegExp(`(^|&)${u}=([^&]*)(&|$)`,"i")
const matchArr = window.location.search.substr(1).match(reg)
if (matchArr != null) return (matchArr[2])
return null
}
}
}
文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請注明本文地址：http://systransis.cn/yun/90276.html
摘要：添加依賴到如何使用依賴當(dāng)你再興建一個文件的時候，就不需要一個個插件安裝了，將文件復(fù)制到當(dāng)前文件下，并輸入，即通過里的依賴關(guān)系，自動把依賴安裝好了。第四步新建配置文件默認(rèn)的配置文件在項(xiàng)目目錄下為。 WilsonLius blog 首發(fā)地址 前言 早就想嘗試webpack的，卻一直沒有時間，恰逢周末，又時值最近在公司實(shí)習(xí)的時候嘗到用fekit做模塊化的構(gòu)建工具的爽。所以就開始以公司的項(xiàng)目結(jié)...
摘要：箭頭函數(shù)我們來看一下箭頭函數(shù)的效果箭頭函數(shù)是無法通過來修改作用域的這個需要切記。所以切記在需要的時候使用箭頭函數(shù)。 這是一些小問題的記錄和總結(jié)： 1. vue serve和build 在vue-cli3.0中可以快速的開發(fā)原型。通過全局安全@vue/cli-service-global npm i -g @vue/cli-service-global 那么就可以使用vue serve ...
閱讀 919·2021-11-22 12:04
閱讀 2125·2021-11-02 14:46
閱讀 648·2021-08-30 09:44
閱讀 2128·2019-08-30 15:54
閱讀 757·2019-08-29 13:48
閱讀 1618·2019-08-29 12:56
閱讀 3481·2019-08-28 17:51
閱讀 3306·2019-08-26 13:44
