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封装的textarea操作方法集合(兼容很好)
Nov 16 Javascript
跨域传值即主页面与iframe之间互相传值
Dec 09 Javascript
超链接的禁用属性Disabled使用示例
Jul 31 Javascript
JS表的模拟方法
Feb 05 Javascript
jquery实现上下左右滑动的方法
Feb 09 Javascript
javascript中局部变量和全局变量的区别详解
Feb 27 Javascript
浅谈Javascript实现继承的方法
Jul 06 Javascript
jQuery实现页面下拉100像素出现悬浮窗口的方法
Sep 05 Javascript
Angular排序实例详解
Jun 28 Javascript
jQuery动态生成的元素绑定事件操作实例分析
May 04 jQuery
Element Steps步骤条的使用方法
Jul 26 Javascript
小程序自定义圆形进度条
Nov 17 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
php引用计数器进行垃圾收集机制介绍
2012/09/19 PHP
js同时按下两个方向键
2007/12/01 Javascript
JavaScript 面向对象之命名空间
2010/05/04 Javascript
Extjs显示从数据库取出时间转换JSON后的出现问题
2012/11/20 Javascript
JS定时刷新页面及跳转页面的方法
2013/07/04 Javascript
HTML长文本截取含有HTML代码同样适用的两种方法
2013/07/31 Javascript
js 获取浏览器版本以此来调整CSS的样式
2014/06/03 Javascript
分享20个提升网站界面体验的jQuery插件
2014/12/15 Javascript
javascript实现简单的贪吃蛇游戏
2015/03/31 Javascript
JavaScript实现点击文字切换登录窗口的方法
2015/05/11 Javascript
概述javascript在Google IE中的调试技巧
2016/11/24 Javascript
简单实现Bootstrap标签页
2020/08/09 Javascript
jQuery和CSS仿京东仿淘宝列表导航菜单
2017/01/04 Javascript
js实现字符全排列算法的简单方法
2017/05/01 Javascript
使用canvas进行图像编辑的实例
2017/08/29 Javascript
原生JS实现$.param() 函数的方法
2018/08/10 Javascript
Angular6 写一个简单的Select组件示例
2018/08/20 Javascript
vue基于element-ui的三级CheckBox复选框功能的实现代码
2018/10/15 Javascript
详解用场景去理解函数柯里化(入门篇)
2019/04/11 Javascript
js实现列表按字母排序
2020/08/11 Javascript
Python基类函数的重载与调用实例分析
2015/01/12 Python
Python获取当前路径实现代码
2017/05/08 Python
python读取excel进行遍历/xlrd模块操作
2020/07/12 Python
pytorch学习教程之自定义数据集
2020/11/10 Python
荷兰牛仔裤网上商店:Jeans Centre
2018/04/03 全球购物
腾讯技术类校园招聘笔试试题
2014/05/06 面试题
工程管理造价应届生求职信
2013/11/13 职场文书
大学自我评价
2014/02/12 职场文书
幼儿园安全生产月活动总结
2014/07/05 职场文书
政风行风建设责任书
2014/07/23 职场文书
私人房屋买卖协议书
2014/10/04 职场文书
机关作风整顿个人剖析材料
2014/10/06 职场文书
慈善募捐倡议书
2015/04/27 职场文书
走近毛泽东观后感
2015/06/04 职场文书
5个pandas调用函数的方法让数据处理更加灵活自如
2022/04/24 Python
Nginx如何限制IP访问只允许特定域名访问
2022/07/23 Servers