const urlUtil = {
// 獲取url的參數(shù)
getQuery(url) {
url = url || window.location.href;
const [path0, hash] = url.split('#');
const [_0, search] = path0.split('?');
const [_1, hashSearch] = (hash || '').split('?');
console.log(_0, _1);
const query0 = this._parseSearch('?' + (search || ''));
const query1 = this._parseSearch('?' + (hashSearch || ''));
return { ...query0, ...query1 };
},
// 添加參數(shù)
addQuery(params, url) {
params = params || {};
url = url || window.location.href;
let [path0, hash] = url.split('#');
// 如果有hash,則參數(shù)加在hash后面,否則加在search上
if (hash) {
const [newHash, hashSearch] = hash.split('?');
const query = this._parseSearch('?' + (hashSearch || ''));
const newQueryStr = this._queryString({
...query,
...params,
});
hash = newHash + (newQueryStr ? '?' + newQueryStr : '');
} else {
const [newPath0, search] = path0.split('?');
const query = this._parseSearch('?' + (search || ''));
const newQueryStr = this._queryString({
...query,
...params,
});
path0 = newPath0 + (newQueryStr ? '?' + newQueryStr : '');
}
return path0 + (hash ? '#' + hash : '');
},
// 移除參數(shù)
removeQuery(keys, url) {
keys = keys || [];
url = url || window.location.href;
let [path0, hash] = url.split('#');
if (hash) {
const [newHash, hashSearch] = hash.split('?');
const query = this._parseSearch('?' + (hashSearch || ''));
keys.forEach(key => {
delete query[key];
});
const newQueryStr = this._queryString(query);
hash = newHash + (newQueryStr ? '?' + newQueryStr : '');
}
const [newPath0, search] = path0.split('?');
const query = this._parseSearch('?' + (search || ''));
keys.forEach(key => {
delete query[key];
});
const newQueryStr = this._queryString(query);
path0 = newPath0 + (newQueryStr ? '?' + newQueryStr : '');
return path0 + (hash ? '#' + hash : '');
},
_parseSearch(search = '') {
// search里面一定要有問(wèn)號(hào)
search = search || '';
const queryObj = {};
const reg = /[?&]([^=&#]+)=([^&#]*)/g;
const queryArr = search.match(reg) || [];
for (const i in queryArr) {
if (Object.hasOwnProperty.call(queryArr, i)) {
const query = queryArr[i].split('=');
const key = query[0].substr(1);
const value = decodeURIComponent(query[1]);
queryObj[key] = value;
}
}
return queryObj;
},
_queryString(query = {}) {
return Object.keys(query).map(key => `${key}=${(query[key] == null ? '' : query[key])}`).join('&');
}
}
export default urlUtil;
解析url參數(shù)和往url拼接參數(shù)
最后編輯于 :
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀(guān)點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀(guān)點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。
相關(guān)閱讀更多精彩內(nèi)容
- 廢話(huà)不多說(shuō)直接上代碼 安裝依賴(lài)npm i --save-dev query-string 引入到項(xiàng)目中去impor...
- url參數(shù)解析為一個(gè)對(duì)象 序列化數(shù)據(jù)為URL參數(shù) 經(jīng)典前端面試題每日更新,歡迎參與討論,地址:https://gi...
- 一條完整的url由請(qǐng)求協(xié)議、域名、請(qǐng)求相對(duì)路徑、請(qǐng)求參數(shù)組成,例如:http://api.bilibili.com...