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 相关文章推荐
Javascript中的Split使用方法与技巧
Mar 09 Javascript
Jquery 获得服务器控件值的方法小结
May 11 Javascript
利用js 进行输入框自动匹配字符的小例子
Jun 29 Javascript
jQuery实现鼠标可拖动调整表格列宽度
May 26 Javascript
JQuery获取表格数据示例代码
May 26 Javascript
jQuery实现form表单基于ajax无刷新提交方法详解
Dec 08 Javascript
Node.js静态文件服务器改进版
Jan 10 Javascript
JS实现简单的右下角弹出提示窗口完整实例
Jun 21 Javascript
js实现点击每个li节点,都弹出其文本值及修改
Dec 15 Javascript
用react-redux实现react组件之间数据共享的方法
Jun 08 Javascript
给localStorage设置一个过期时间的方法分享
Nov 06 Javascript
layer弹出层自定义提交取消按钮的例子
Sep 10 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
世界第一个无线广播电台 KDKA
2021/03/01 无线电
PHP垃圾回收机制引用计数器概念分析
2013/06/24 PHP
ThinkPHP之M方法实例详解
2014/06/20 PHP
thinkphp3.2实现上传图片的控制器方法
2016/04/28 PHP
用js实现判断当前网址的来路如果不是指定的来路就跳转到指定页面
2011/05/02 Javascript
一个挺有意思的Javascript小问题说明
2011/09/26 Javascript
jQuery 滑动方法slideDown向下滑动元素
2014/01/16 Javascript
js post提交调用方法
2014/02/12 Javascript
js实现从右向左缓缓浮出网页浮动层广告的方法
2015/05/09 Javascript
详解Jquery Easyui的验证扩展
2017/01/09 Javascript
VUE实现一个分页组件的示例
2017/09/13 Javascript
Node.js中环境变量process.env的一些事详解
2017/10/26 Javascript
一个简单的node.js界面实现方法
2018/06/01 Javascript
vue添加class样式实例讲解
2019/02/12 Javascript
vue实现绑定事件的方法实例代码详解
2019/06/20 Javascript
JS计算斐波拉切代码实例
2019/09/12 Javascript
Vue的生命周期操作示例
2019/09/17 Javascript
[02:08]2014DOTA2国际邀请赛 430专访:力争取得小组前二
2014/07/11 DOTA
[02:42]完美大师赛主赛事淘汰赛第三日观众采访
2017/11/25 DOTA
Python使用Pycrypto库进行RSA加密的方法详解
2016/06/06 Python
Python基于mysql实现学生管理系统
2019/02/21 Python
django 中的聚合函数,分组函数,F 查询,Q查询
2019/07/25 Python
Python Websocket服务端通信的使用示例
2020/02/25 Python
python对execl 处理操作代码
2020/06/22 Python
基于Django快速集成Echarts代码示例
2020/12/01 Python
Html5实现移动端、PC端 刮刮卡效果
2016/06/30 HTML / CSS
HTML5给汉字加拼音收起展开组件的实现代码
2020/04/08 HTML / CSS
HTML里显示pdf、word、xls、ppt的方法示例
2020/04/14 HTML / CSS
中国高端鲜花第一品牌:roseonly(一生只送一人)
2017/02/12 全球购物
程序运行正确, 但退出时却"core dump"了,怎么回事
2014/02/19 面试题
教师自荐书
2013/10/08 职场文书
机关党建工作汇报材料
2014/08/20 职场文书
班子个人四风问题整改措施
2014/10/04 职场文书
接收函
2019/04/22 职场文书
四年级作文之植物
2019/09/20 职场文书
Python实现自动玩连连看的脚本分享
2022/04/04 Python