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 相关文章推荐
对google个性主页的拖拽效果的js的完整注释[转]
Apr 10 Javascript
javascript 45种缓动效果 非常酷
Jun 28 Javascript
判断滚动条到底部的JS代码
Nov 04 Javascript
js文本框输入点回车触发确定兼容IE、FF等
Nov 19 Javascript
ECMAScript6函数剩余参数(Rest Parameters)
Jun 12 Javascript
Bootstrap每天必学之按钮
Nov 26 Javascript
JavaScript学习笔记之数组求和方法
Mar 23 Javascript
解决微信内置浏览器返回上一页强制刷新问题方法
Feb 05 Javascript
浅谈angular4实际项目搭建总结
Dec 01 Javascript
Vue传参一箩筐(页面、组件)
Apr 04 Javascript
js 对象使用的小技巧实例分析
Nov 08 Javascript
Vue3不支持Filters过滤器的问题
Sep 24 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中Trait及其应用详解
2017/02/14 PHP
PHP 实现公历日期与农历日期的互转换
2017/09/13 PHP
js获取单选按钮的数据
2006/11/27 Javascript
js表数据排序 sort table data
2009/02/18 Javascript
IE中radio 或checkbox的checked属性初始状态下不能选中显示问题
2009/07/25 Javascript
用Jquery实现可编辑表格并用AJAX提交到服务器修改数据
2009/12/27 Javascript
一次失败的jQuery优化尝试小结
2011/02/06 Javascript
js常用代码段整理
2011/11/30 Javascript
深入理解JavaScript系列(2) 揭秘命名函数表达式
2012/01/15 Javascript
jQuery图片滚动图片的效果(另类实现)
2013/06/02 Javascript
js实现通用的微信分享组件示例
2014/03/10 Javascript
js实现键盘操作实现div的移动或改变的原理及代码
2014/06/23 Javascript
iscroll碰到Select无法选择下拉刷新的解决办法
2016/05/21 Javascript
js实现简单的网页换肤效果
2017/01/18 Javascript
JS正则表达式验证账号、手机号、电话和邮箱是否合法
2017/03/08 Javascript
简单的网页广告特效实例
2017/08/19 Javascript
移动端效果之Swiper详解
2017/10/09 Javascript
微信公众号服务器验证Token步骤图解
2019/12/30 Javascript
JavaScript数组类型Array相关的属性与方法详解
2020/09/08 Javascript
JavaScript WeakMap使用详解
2021/02/05 Javascript
python实现telnet客户端的方法
2015/04/15 Python
python日志记录模块实例及改进
2017/02/12 Python
浅谈机器学习需要的了解的十大算法
2017/12/15 Python
Python使用flask框架操作sqlite3的两种方式
2018/01/31 Python
python2.7实现邮件发送功能
2018/12/12 Python
从运行效率与开发效率比较Python和C++
2018/12/14 Python
Python实现列表中非负数保留,负数转化为指定的数值方式
2020/06/04 Python
python属于解释型语言么
2020/06/15 Python
英国最受信任的在线眼镜商之一:Fashion Eyewear
2019/10/31 全球购物
质检部岗位职责
2013/11/11 职场文书
通知函的格式
2015/04/27 职场文书
2015年小学语文工作总结
2015/05/25 职场文书
招商银行收入证明
2015/06/17 职场文书
MySQL 可扩展设计的基本原则
2021/05/14 MySQL
教你利用Selenium+python自动化来解决pip使用异常
2021/05/20 Python
MySQL面试题讲解之如何设置Hash索引
2021/11/01 MySQL