| 提交 | 用户 | age | ||
| 36e1de | 1 | /* |
| L | 2 | * @Author: 丘骏_jun |
| 3 | * @Date: 2019-11-21 10:59:17 | |
| 4 | * @Last Modified by: 丘骏_jun | |
| 5 | * @Last Modified time: 2019-12-30 16:29:45 | |
| 6 | */ | |
| 7 | // 通用function，通过全局安装，或import引用调用 | |
| 8 | ||
| 9 | let scrollBarWidth // 滚动条宽度 | |
| 10 | // 获取浏览器滚动条宽度 | |
| 11 | function getScrollBarWidth () { | |
| 12 | if (scrollBarWidth !== undefined) return scrollBarWidth; | |
| 13 | ||
| 14 | const outer = document.createElement('div'); | |
| 15 | outer.className = 'el-scrollbar__wrap'; | |
| 16 | outer.style.visibility = 'hidden'; | |
| 17 | outer.style.width = '100px'; | |
| 18 | outer.style.position = 'absolute'; | |
| 19 | outer.style.top = '-9999px'; | |
| 20 | document.body.appendChild(outer); | |
| 21 | ||
| 22 | const widthNoScroll = outer.offsetWidth; | |
| 23 | outer.style.overflow = 'scroll'; | |
| 24 | ||
| 25 | const inner = document.createElement('div'); | |
| 26 | inner.style.width = '100%'; | |
| 27 | outer.appendChild(inner); | |
| 28 | ||
| 29 | const widthWithScroll = inner.offsetWidth; | |
| 30 | outer.parentNode.removeChild(outer); | |
| 31 | scrollBarWidth = widthNoScroll - widthWithScroll; | |
| 32 | ||
| 33 | return scrollBarWidth; | |
| 34 | } | |
| 35 | // 获取最近样式 | |
| 36 | // function getCurrentStyle (obj, prop) { | |
| 37 | // if (obj.currentStyle) { | |
| 38 | // return obj.currentStyle[prop]; | |
| 39 | // } else if (window.getComputedStyle) { | |
| 40 | // prop = prop.replace(/([A-Z])/g, "-$1"); | |
| 41 | // prop = prop.toLowerCase(); | |
| 42 | // return document.defaultView.getComputedStyle(obj, null)[prop]; | |
| 43 | // } | |
| 44 | // return null; | |
| 45 | // } | |
| 46 | // // 判断是否有滚动条 | |
| 47 | // function hasScrollBar (obj) { | |
| 48 | // return getCurrentStyle(obj, 'overflow') == 'hidden' | |
| 49 | // ? 0 | |
| 50 | // : document.body.scrollHeight > (window.innerHeight || document.documentElement.clientHeight); | |
| 51 | // } | |
| 52 | ||
| 53 | // 日期格式化 | |
| 54 | Date.prototype.format = function(format){ | |
| 55 | var o = { | |
| 56 | "M+" : this.getMonth()+1, //month | |
| 57 | "d+" : this.getDate(), //day | |
| 58 | "H+" : this.getHours(), //hour | |
| 59 | "m+" : this.getMinutes(), //minute | |
| 60 | "s+" : this.getSeconds(), //second | |
| 61 | "q+" : Math.floor((this.getMonth()+3)/3), //quarter | |
| 62 | "S" : this.getMilliseconds() //millisecond | |
| 63 | }; | |
| 64 | ||
| 65 | if(/(y+)/.test(format)) { | |
| 66 | format = format.replace(RegExp.$1, (this.getFullYear()+"").substr(4 - RegExp.$1.length)); | |
| 67 | } | |
| 68 | ||
| 69 | for(var k in o) { | |
| 70 | if(new RegExp("("+ k +")").test(format)) { | |
| 71 | format = format.replace(RegExp.$1, RegExp.$1.length==1 ? o[k] : ("00"+ o[k]).substr((""+ o[k]).length)); | |
| 72 | } | |
| 73 | } | |
| 74 | return format; | |
| 75 | }; | |
| 76 | ||
| 77 | // 消除字符串多余空格 | |
| 78 | if (!String.prototype.trim) { | |
| 79 | String.prototype.trim = function () { | |
| 80 | return this.replace(/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g, ''); | |
| 81 | }; | |
| 82 | } | |
| 83 | ||
| 84 | /** | |
| 85 | * 获取本地缓存 localStorage | |
| 86 | * @param {string} key storage 标记 | |
| 87 | * @return {*} 值 | |
| 88 | */ | |
| 89 | function getLocalStorage(key){ | |
| 90 | if (!key) { | |
| 91 | return | |
| 92 | } | |
| 93 | var result = localStorage.getItem(key) || '' | |
| 94 | try { | |
| 95 | result = JSON.parse(result) | |
| 96 | } catch(e) { | |
| 97 | ||
| 98 | } | |
| 99 | return result | |
| 100 | } | |
| 101 | ||
| 102 | /** | |
| 103 | * 获取本地缓存 sessionStorage | |
| 104 | * @param {string} key storage 标记 | |
| 105 | * @return {*} 值 | |
| 106 | */ | |
| 107 | function getSessionStorage(key){ | |
| 108 | var result = sessionStorage.getItem(key) || '' | |
| 109 | try { | |
| 110 | result = JSON.parse(result) | |
| 111 | } catch(e) { | |
| 112 | ||
| 113 | } | |
| 114 | return result | |
| 115 | } | |
| 116 | ||
| 117 | /** | |
| 118 | * 保存本地缓存 localStorage | |
| 119 | * @param {string} key storage 标记 | |
| 120 | * @param {*} value 值 | |
| 121 | */ | |
| 122 | function setLocalStorage(key, value){ | |
| 123 | if (typeof value === 'object') { | |
| 124 | value = JSON.stringify(value) | |
| 125 | } | |
| 126 | localStorage.setItem(key, value) | |
| 127 | } | |
| 128 | ||
| 129 | /** | |
| 130 | * 保存本地缓存 sessionStorage | |
| 131 | * @param {string} key storage 标记 | |
| 132 | * @param {*} value 值 | |
| 133 | */ | |
| 134 | function setSessionStorage(key, value){ | |
| 135 | if (typeof value === 'object') { | |
| 136 | value = JSON.stringify(value) | |
| 137 | } | |
| 138 | sessionStorage.setItem(key, value) | |
| 139 | } | |
| 140 | ||
| 141 | /** | |
| 142 | * 移除本地缓存 localStorage | |
| 143 | * @param {string} key storage 标记 | |
| 144 | */ | |
| 145 | function removeLocalStorage(key){ | |
| 146 | localStorage.removeItem(key) | |
| 147 | } | |
| 148 | ||
| 149 | /** | |
| 150 | * 移除本地缓存 sessionStorage | |
| 151 | * @param {string} key storage 标记 | |
| 152 | */ | |
| 153 | function removeSessionStorage(key){ | |
| 154 | sessionStorage.removeItem(key) | |
| 155 | } | |
| 156 | ||
| 157 | /** | |
| 158 | * 输入的价格限制在两位小数 | |
| 159 | * @param {string} number 价格 | |
| 160 | * @return {string} 过滤后的价格 | |
| 161 | */ | |
| 162 | function toFixed2 (number) { | |
| 163 | number += '' | |
| 164 | if (number == '') { | |
| 165 | return '' | |
| 166 | } | |
| 167 | if (isNaN(number)) { | |
| 168 | return '' | |
| 169 | } | |
| 170 | ||
| 171 | if (number.indexOf('.')>-1) { | |
| 172 | var arr = number.split('.') | |
| 173 | if (arr[1].length>2) { | |
| 174 | arr[1] = arr[1].substring(0, 2) | |
| 175 | } | |
| 176 | number = arr[0] + '.' + arr[1] | |
| 177 | return number | |
| 178 | } | |
| 179 | ||
| 180 | return number | |
| 181 | } | |
| 182 | /** | |
| 183 | * 价格转，分，为单位 | |
| 184 | * @param {string|number} price | |
| 185 | */ | |
| 186 | function amountFen (price) { | |
| 187 | return parseInt(price*100) | |
| 188 | } | |
| 189 | ||
| 190 | /** | |
| 191 | * 获取查询字符串 | |
| 192 | * @param {string} name | |
| 193 | * @param {string} url 默认 location.href | |
| 194 | */ | |
| 195 | function getQueryString(name, url){ | |
| 196 | url = url || location.href | |
| 197 | ||
| 198 | url = url.replace(/\#\S*/g, '') | |
| 199 | ||
| 200 | var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); | |
| 201 | var r = /\?/.test(url) && url.split('?')[1].match(reg); | |
| 202 | if(r != null) { | |
| 203 | return r[2]; | |
| 204 | } | |
| 205 | return ""; | |
| 206 | } | |
| 207 | ||
| 208 | // 全局缓存 | |
| 209 | var g_el = null | |
| 210 | /** | |
| 211 | * 绑定div滚动到底部 | |
| 212 | * @param {dom} el | |
| 213 | * @param {function} callback | |
| 214 | */ | |
| 215 | function onReachBottom (el, callback) { | |
| 216 | let offsetHeight = el.offsetHeight || window.outerHeight | |
| 217 | let isWindow = el === window | |
| 218 | g_el = el | |
| 219 | ||
| 220 | el.onscroll = ()=>{ | |
| 221 | let scrollTop = isWindow ? document.documentElement.scrollTop : el.scrollTop | |
| 222 | let scrollHeight = isWindow ? document.body.scrollHeight : el.scrollHeight | |
| 223 | // console.log(scrollTop, scrollHeight) | |
| 224 | // console.log(offsetHeight, scrollTop, scrollHeight) | |
| 225 | if ((offsetHeight + scrollTop) - scrollHeight >= -1) { | |
| 226 | typeof callback === 'function' && callback() | |
| 227 | } | |
| 228 | } | |
| 229 | } | |
| 230 | /** | |
| 231 | * 取消绑定 | |
| 232 | * @param {dom} el | |
| 233 | */ | |
| 234 | function offReachBottom (el) { | |
| 235 | el = el || g_el | |
| 236 | el.onscroll = null | |
| 237 | g_el = null | |
| 238 | } | |
| 239 | /** | |
| 240 | * 生成唯一id | |
| 241 | */ | |
| 242 | function uuid () { | |
| 243 | var s = [] | |
| 244 | var hexDigits = '0123456789abcdef' | |
| 245 | for (var i = 0; i < 36; i++) { | |
| 246 | s[i] = hexDigits.substr(Math.floor(Math.random() * 0x10), 1) | |
| 247 | } | |
| 248 | s[14] = '4'; | |
| 249 | s[19] = hexDigits.substr((s[19] & 0x3) | 0x8, 1); | |
| 250 | ||
| 251 | s[8] = s[13] = s[18] = s[23] = '-' | |
| 252 | var uuid = s.join('') | |
| 253 | return uuid | |
| 254 | } | |
| 255 | ||
| 256 | /** | |
| 257 | * 替换当前链接，无返回 | |
| 258 | * @param {string} href | |
| 259 | */ | |
| 260 | function urlReplace (href) { | |
| 261 | if (!href) { | |
| 262 | return; | |
| 263 | } | |
| 264 | if (href && /^#|javasc/.test(href) === false) { | |
| 265 | if (history.replaceState) { | |
| 266 | history.replaceState(null, document.title, href.split('#')[0] + '#'); | |
| 267 | location.replace(href); | |
| 268 | } else { | |
| 269 | location.replace(href); | |
| 270 | } | |
| 271 | } | |
| 272 | }; | |
| 273 | ||
| 274 | var fn = { | |
| 275 | getLocalStorage, | |
| 276 | getSessionStorage, | |
| 277 | setLocalStorage, | |
| 278 | setSessionStorage, | |
| 279 | removeLocalStorage, | |
| 280 | removeSessionStorage, | |
| 281 | ||
| 282 | // 判断是否有滚动条，并获取滚动宽度 | |
| 283 | // getScrollBarWidth () { | |
| 284 | // return hasScrollBar(document.body) ? getScrollBarWidth() : 0 | |
| 285 | // }, | |
| 286 | getScrollBarWidth, | |
| 287 | ||
| 288 | toFixed2, | |
| 289 | amountFen, | |
| 290 | ||
| 291 | getQueryString, | |
| 292 | onReachBottom, | |
| 293 | offReachBottom, | |
| 294 | ||
| 295 | uuid, | |
| 296 | urlReplace, | |
| 297 | ||
| 298 | /** | |
| 299 | * 深拷贝 | |
| 300 | * @param {object} obj 被复制的对象 | |
| 301 | * @return {object} 复制完成的对象 | |
| 302 | */ | |
| 303 | deepCopyFN (obj) { | |
| 304 | if (typeof obj !== 'object') { | |
| 305 | return obj | |
| 306 | } | |
| 307 | ||
| 308 | let cloneObj = {} | |
| 309 | switch (obj.constructor) { | |
| 310 | case Array: | |
| 311 | cloneObj = [] | |
| 312 | case Object: | |
| 313 | for (var property in obj) { | |
| 314 | cloneObj[property] = typeof obj[property] === 'object' ? this.deepCopyFN(obj[property]) : obj[property] | |
| 315 | } | |
| 316 | break | |
| 317 | case Map: | |
| 318 | cloneObj = new Map() | |
| 319 | obj.forEach((value, key) => { | |
| 320 | cloneObj.set(key, typeof value === 'object' ? this.deepCopyFN(value) : value) | |
| 321 | }) | |
| 322 | break | |
| 323 | case Set: | |
| 324 | cloneObj = new Set() | |
| 325 | obj.forEach(value => { | |
| 326 | cloneObj.add(typeof value === 'object' ? this.deepCopyFN(value) : value) | |
| 327 | }) | |
| 328 | break | |
| 329 | } | |
| 330 | return cloneObj | |
| 331 | }, | |
| 332 | } | |
| 333 | export default fn | |
