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 相关文章推荐
iphone safari不支持position fixed的解决方法
May 04 Javascript
js 限制数字 js限制输入实现代码
Dec 04 Javascript
javascript转换日期字符串为Date日期对象的方法
Feb 13 Javascript
Ionic如何创建APP项目
Jun 03 Javascript
Active控件问题小结(附解决办法)
Jun 09 Javascript
Javascript实现图片加载从模糊到清晰显示的方法
Jun 21 Javascript
使用UrlConnection实现后台模拟http请求的简单实例
Jan 04 Javascript
Vue.js教程之axios与网络传输的学习实践
Apr 29 Javascript
详解webpack+express多页站点开发
Dec 22 Javascript
Chart.js 轻量级HTML5图表绘制工具库(知识整理)
May 22 Javascript
JS栈stack类的实现与使用方法示例
Jan 31 Javascript
Vue 实现点击空白处隐藏某节点的三种方式(指令、普通、遮罩)
Oct 23 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/02/29 PHP
PHP服务器页面间跳转实现方法
2012/08/02 PHP
ThinkPHP2.0读取MSSQL提示Incorrect syntax near the keyword 'AS'的解决方法
2014/06/25 PHP
PHP使用静态方法的几个注意事项
2014/09/16 PHP
JS实现浏览器菜单命令
2006/09/05 Javascript
boxy基于jquery的弹出层对话框插件扩展应用 弹出层选择器
2010/11/21 Javascript
Jquery同辈元素选中/未选中效果的实例代码
2013/08/01 Javascript
javascript 获取图片尺寸及放大图片
2013/09/04 Javascript
JavaScript通过正则表达式实现表单验证电话号码
2014/03/07 Javascript
JsRender for index循环索引用法详解
2014/10/31 Javascript
简述JavaScript的正则表达式中test()方法的使用
2015/06/16 Javascript
jquery中的常见问题及快速解决方法小结
2016/06/14 Javascript
在vue-cli脚手架中配置一个vue-router前端路由
2017/07/03 Javascript
重新认识vue之事件阻止冒泡的实现
2018/08/02 Javascript
Django模板继承 extend标签实例代码详解
2019/05/16 Javascript
Vue + Elementui实现多标签页共存的方法
2019/06/12 Javascript
微信小程序wx.navigateTo方法里的events参数使用详情及场景
2020/01/07 Javascript
Vue+axios封装请求实现前后端分离
2020/10/23 Javascript
[01:14:35]DOTA2上海特级锦标赛B组资格赛#1 Alliance VS Fnatic第一局
2016/02/26 DOTA
python使用BeautifulSoup分页网页中超链接的方法
2015/04/04 Python
Python复制Word内容并使用格式设字体与大小实例代码
2018/01/22 Python
使用 Python 快速实现 HTTP 和 FTP 服务器的方法
2019/07/22 Python
Django错误:TypeError at / 'bool' object is not callable解决
2019/08/16 Python
Matplotlib中%matplotlib inline如何使用
2020/07/28 Python
css3设置box-pack和box-align让div里面的元素垂直居中
2014/09/01 HTML / CSS
纯CSS3实现鼠标滑过按钮动画第二节
2020/07/16 HTML / CSS
html5 datalist 选中option选项后的触发事件
2020/03/05 HTML / CSS
美国猫狗药物和用品网站:PetCareRx
2017/01/05 全球购物
SQL面试题
2013/12/09 面试题
中专生自荐信
2013/10/12 职场文书
寒假思想汇报
2014/01/10 职场文书
民警群众路线教育实践活动对照检查材料
2014/10/04 职场文书
报案材料怎么写
2015/05/25 职场文书
旗帜观后感
2015/06/08 职场文书
Python控制台输出俄罗斯方块移动和旋转功能
2021/04/18 Python
python利用pandas分析学生期末成绩实例代码
2021/07/09 Python