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 相关文章推荐
用ASP将SQL搜索出来的内容导出为TXT的代码
Jul 27 Javascript
jQuery的extend方法【三种】
Dec 14 Javascript
jquery实现超简单的瀑布流布局【推荐】
Mar 08 Javascript
Angular4学习笔记之准备和环境搭建项目
Aug 01 Javascript
js排序与重组的实例讲解
Aug 28 Javascript
微信小程序 input表单与redio及下拉列表的使用实例
Sep 20 Javascript
jQuery选择器之子元素过滤选择器
Sep 28 jQuery
微信小程序有旋转动画效果的音乐组件实例代码
Aug 22 Javascript
react脚手架如何配置less和ant按需加载的方法步骤
Nov 28 Javascript
Vue父组件如何获取子组件中的变量
Jul 24 Javascript
Vue中常用rules校验规则(实例代码)
Nov 14 Javascript
vue-cli设置publicPath小记
Apr 14 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
使用TinyButStrong模板引擎来做WEB开发
2007/03/16 PHP
PhpMyAdmin中无法导入sql文件的解决办法
2010/01/08 PHP
基于initPHP的框架介绍
2013/04/18 PHP
浅析虚拟主机服务器php fsockopen函数被禁用的解决办法
2013/08/07 PHP
CentOS下与Apache连接的PHP多版本共存方案实现详解
2015/12/19 PHP
jQuery插件slides实现无缝轮播图特效
2015/04/17 Javascript
详解javascript new的运行机制
2016/01/26 Javascript
JS实现为排序好的字符串找出重复行的方法
2016/03/02 Javascript
js获取当前时间(昨天、今天、明天)
2016/11/23 Javascript
深入理解jquery中extend的实现
2016/12/22 Javascript
基于JQuery的购物车添加删除以及结算功能示例
2017/03/08 Javascript
Require.JS中的几种define定义方式示例
2017/06/01 Javascript
JS 仿支付宝input文本输入框放大组件的实例
2017/11/14 Javascript
微信小程序 scroll-view实现锚点滑动的示例
2017/12/06 Javascript
详解tween.js 中文使用指南
2018/01/05 Javascript
vue使用video.js进行视频播放功能
2019/07/18 Javascript
python在Windows下安装setuptools(easy_install工具)步骤详解
2016/07/01 Python
正确理解python中的关键字“with”与上下文管理器
2017/04/21 Python
python3模块smtplib实现发送邮件功能
2018/05/22 Python
python爬虫爬取幽默笑话网站
2019/10/24 Python
python 列表、字典和集合的添加和删除操作
2019/12/16 Python
Django集成celery发送异步邮件实例
2019/12/17 Python
python Socket网络编程实现C/S模式和P2P
2020/06/22 Python
PyCharm 2020.2下配置Anaconda环境的方法步骤
2020/09/23 Python
HTML5 Canvas 起步(1) - 基本概念
2009/05/12 HTML / CSS
AmazeUI 导航条的实现示例
2020/08/14 HTML / CSS
植村秀加拿大官网:Shu Uemura加拿大
2019/09/03 全球购物
医学生求职自荐信
2013/10/25 职场文书
车间工艺员岗位职责
2013/12/09 职场文书
中专生自我鉴定书范文
2013/12/28 职场文书
合作协议书怎么写
2014/04/18 职场文书
新手上路标语
2014/06/20 职场文书
庆祝国庆节演讲稿2014
2014/09/19 职场文书
个人租房协议书范本
2014/09/30 职场文书
优秀工作者事迹材料
2014/12/26 职场文书
2015年12.4全国法制宣传日活动总结
2015/03/24 职场文书