Vue中util的工具函数实例详解


Posted in Javascript onJuly 08, 2019

Vue中util的工具函数,下面通过实例代码给大家介绍的非常详细,具体代码如下所示:

// 防抖函数
function debounce (fn, wait) {
let t
return () => {
let context = this
let args = arguments
if (t) clearTimeout(t)
t = setTimeout(() => {
 fn.apply(context, args)
}, wait)
}
}
function flatten (arr) { // 数组扁平化
return arr.reduce((result, item) => {
return result.concat(Array.isArray(item) ? flatten(item) : item)
}, [])
}
function handleMulitePerson (sPerson) {
console.log(44, sPerson.split(','))
if (typeof sPerson == 'string') {
let personArr = []
sPerson.split(',').forEach(item => {
 let obj = { userCode: item.split('/')[0], userName: item.split('/')[1] }
 personArr.push(obj)
})
return personArr
}
}
function uniqueArray (array, key) { // json数组根据key去重
var result = [array[0]]
for (var i = 1; i < array.length; i++) {
var item = array[i]
var repeat = false
for (var j = 0; j < result.length; j++) {
 if (item[key] == result[j][key]) {
  repeat = true
  break
 }
}
if (!repeat) {
 result.push(item)
}
}
return result
}
function setSessionStorage (key, val) {
if (typeof (val) == 'object') {
sessionStorage.setItem(key, JSON.stringify(val))
} else {
sessionStorage.setItem(key, val)
}
}
function getSessionStorage (key) {
return sessionStorage.getItem(key)
}
function removeStorage (key) {
sessionStorage.removeItem(key)
}
function urlParams () { // 获取链接参数
var str = location.search.length > 0 ? location.search.substring(1) : ''
var items = str.length ? str.split('&') : []
var args = {}
var item = null
var name = null
var value = null
for (let i = 0, len = items.length; i < len; i++) {
item = items[i].split('=')
name = decodeURIComponent(item[0])
value = decodeURIComponent(item[1])
if (name.length) {
 args[name] = value
}
};
return args
}
function urlAfterParams () {
var str = window.location.hash.length > 0 ? window.location.hash.substring(window.location.hash.indexOf('?') + 1) : ''
var items = str.indexOf('&') > 0 ? str.split('&') : str.split('?')
var args = {}
var item = null
var name = null
var value = null
for (let i = 0, len = items.length; i < len; i++) {
item = items[i].split('=')
name = decodeURIComponent(item[0])
value = decodeURIComponent(item[1])
if (name.length) {
 args[name] = value
}
};
return args
}
function parseParams (url) {
url = decodeURIComponent(url)
var params = {}
var idx = url.indexOf('?')
if (idx > 0) {
var queryStr = url.substring(idx + 1)
if (queryStr.length > 0) {
 var arr = queryStr.split('&')
 for (let i = 0; i < arr.length; i++) {
  var pair = arr[i].split('=')
  if (pair.length == 2 && pair[0].length > 0) {
   params[pair[0]] = pair[1]
  }
 }
}
}
return params
}
/**
选人下拉框数据:username(userCode)
*/
function getSelectUserName (userName, userCode) {
return userName + '(' + userCode + ')'
}
function getSelectLoginUser () {
var userInfo = getLoginUserInfo()
return getSelectUserName(userInfo.userName, userInfo.userId)
}
function getUserNameBySelectUserName (userName) {
let i = userName.indexOf('(')
return userName.substring(0, i)
}
/**
登录用户信息
userId
userName
mobileNo
@returns {any}
*/
function getLoginUserInfo () {
return JSON.parse(localStorage.getItem('userInfo'))
}
function getLoginUserCode () {
return JSON.parse(localStorage.getItem('userInfo')).userId
}
export default {
getNyr,
getYDate,
setSessionStorage,
urlParams,
urlAfterParams,
parseParams,
debounce,
handleMulitePerson,
uniqueArray,
flatten,
getSessionStorage,
removeStorage,
getSelectUserName,
getSelectLoginUser,
getLoginUserInfo,
getLoginUserCode,
getUserNameBySelectUserName
}

总结

以上所述是小编给大家介绍的Vue中util的工具函数实例详解,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
离开页面时检测表单元素是否被修改,提示保存的js代码
Aug 25 Javascript
Javascript实现DIV滚动自动滚动到底部的代码
Mar 01 Javascript
js网页版计算器的简单实现
Jul 02 Javascript
浅谈 jQuery 事件源码定位问题
Jun 18 Javascript
js实现无限级树形导航列表效果代码
Sep 23 Javascript
AngularJS 最常用的功能汇总
Feb 17 Javascript
jQuery Ajax使用FormData对象上传文件的方法
Sep 07 Javascript
深入理解JavaScript中的尾调用(Tail Call)
Feb 07 Javascript
详解react服务端渲染(同构)的方法
Sep 21 Javascript
Vue组件开发之LeanCloud带图形校验码的短信发送功能
Nov 07 Javascript
JavaScript正则表达式函数总结(常用)
Feb 22 Javascript
layer弹窗在键盘按回车将反复刷新的实现方法
Sep 25 Javascript
详解基于 Node.js 的轻量级云函数功能实现
Jul 08 #Javascript
使用 node.js 模仿 Apache 小部分功能
Jul 07 #Javascript
echarts统计x轴区间的数值实例代码详解
Jul 07 #Javascript
vue + typescript + video.js实现 流媒体播放 视频监控功能
Jul 07 #Javascript
详解django模板与vue.js冲突问题
Jul 07 #Javascript
django中使用vue.js的要点总结
Jul 07 #Javascript
Vue使用lodop实现打印小结
Jul 06 #Javascript
You might like
如何冲泡挂耳包咖啡?技巧是什么
2021/03/04 冲泡冲煮
PHP递归调用的小技巧讲解
2013/02/19 PHP
PHP开发微信支付的代码分享
2014/05/25 PHP
PHP调用C#开发的dll类库方法
2014/07/28 PHP
PHP实现更新中间关联表数据的两种方法
2014/09/01 PHP
php通过smtp邮件验证登陆的方法
2016/05/11 PHP
[原创]php token使用与验证示例【测试可用】
2017/08/30 PHP
jQuery find和children方法使用
2011/01/31 Javascript
JS检测图片大小的实例
2013/08/21 Javascript
JavaScript去除数组里重复值的方法
2015/07/13 Javascript
使用PHP+JavaScript将HTML页面转换为图片的实例分享
2016/04/18 Javascript
微信jssdk用法汇总
2016/07/16 Javascript
JS实现HTML标签转义及反转义
2020/04/14 Javascript
js清除浏览器缓存的几种方法
2017/03/15 Javascript
React+Webpack快速上手指南(小结)
2018/08/15 Javascript
使用jquery Ajax实现上传附件功能
2018/10/23 jQuery
js实现无刷新监听URL的变化示例代码详解
2020/06/03 Javascript
Python中几种操作字符串的方法的介绍
2015/04/09 Python
Django中ORM表的创建和增删改查方法示例
2017/11/15 Python
详解python中的线程
2018/02/10 Python
python实现根据指定字符截取对应的行的内容方法
2018/10/23 Python
Python实现的银行系统模拟程序完整案例
2019/04/12 Python
Python3常见函数range()用法详解
2019/12/30 Python
PyQt5高级界面控件之QTableWidget的具体使用方法
2020/02/23 Python
详解Python yaml模块
2020/09/23 Python
Html5实现如何在两个div元素之间拖放图像
2013/03/29 HTML / CSS
基于HTML5新特性Mutation Observer实现编辑器的撤销和回退操作
2016/01/11 HTML / CSS
万豪国际住宅与别墅集团:Homes & Villas by Marriott International
2020/10/08 全球购物
大学毕业通用个人的求职信
2013/12/08 职场文书
让生命充满爱演讲稿
2014/05/10 职场文书
建筑工地大门标语
2014/06/18 职场文书
联片教研活动总结
2014/07/01 职场文书
幼儿园保育员责任书
2014/07/22 职场文书
群众路线个人整改措施
2014/10/24 职场文书
英语辞职信范文
2015/02/28 职场文书
《狼牙山五壮士》读后感:宁死不屈,视死如归
2019/08/16 职场文书