返回顶部
首页 > 资讯 > 前端开发 > VUE >Vue中util工具函数怎么用
  • 951
分享到

Vue中util工具函数怎么用

2024-04-02 19:04:59 951人浏览 安东尼
摘要

这篇文章将为大家详细讲解有关Vue中util工具函数怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。Vue中util的工具函数,下面通过实例代码给大家介绍的非常详细,

这篇文章将为大家详细讲解有关Vue中util工具函数怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。

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
}

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)
}

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工具函数怎么用”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,使各位可以学到更多知识,如果觉得文章不错,请把它分享出去让更多的人看到。

--结束END--

本文标题: Vue中util工具函数怎么用

本文链接: https://lsjlt.com/news/73446.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • Vue中util工具函数怎么用
    这篇文章将为大家详细讲解有关Vue中util工具函数怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。Vue中util的工具函数,下面通过实例代码给大家介绍的非常详细,...
    99+
    2024-04-02
  • vue编译器util工具使用方法示例
    目录makeMap源码:isReservedTag 源码:pluckModuleFunction 源码:isReserved 源码:makeMap源码: function makeM...
    99+
    2024-04-02
  • jQuery中的AJAX工具函数怎么用
    本文小编为大家详细介绍“jQuery中的AJAX工具函数怎么用”,内容详细,步骤清晰,细节处理妥当,希望这篇“jQuery中的AJAX工具函数怎么用”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起...
    99+
    2024-04-02
  • Vue项目中常用的工具函数总结
    目录前言一、自定义聚焦指令1、方式一2、方式二3、方式三二、输入框防抖1、需求2、思路3、代码实现三、关键字高亮1、需求2、思路3、代码演示四、格式化Excel表格中存储的时间1、需...
    99+
    2024-04-02
  • vscode工具函数idGenerator怎么使用
    这篇文章主要介绍“vscode工具函数idGenerator怎么使用”的相关知识,小编通过实际案例向大家展示操作过程,操作方法简单快捷,实用性强,希望这篇“vscode工具函数idGenerator怎么使用”文章能帮助大家解决问题。vsco...
    99+
    2023-07-05
  • JavaScript数组常用工具函数怎么使用
    这篇文章主要讲解了“JavaScript数组常用工具函数怎么使用”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“JavaScript数组常用工具函数怎么使用”吧!一. 实现Array.isAr...
    99+
    2023-07-02
  • springboot实现在工具类(util)中调用注入service层方法
    一、新建BeanUtil类 import lombok.extern.slf4j.Slf4j; import org.springframework.beans.BeansExc...
    99+
    2024-04-02
  • util在java中怎么使用
    在Java中,`util`是指`java.util`包,该包中包含了许多常用的工具类和数据结构,可以提供各种实用的功能。要使用`ut...
    99+
    2023-10-09
    java
  • Node.js path模块中的常用工具函数怎么使用
    这篇“Node.js path模块中的常用工具函数怎么使用”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一...
    99+
    2024-04-02
  • JavaScript中实用工具函数有哪些
    这篇文章主要讲解了“JavaScript中实用工具函数有哪些”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“JavaScript中实用工具函数有哪些”吧! ...
    99+
    2024-04-02
  • Vue中的调试工具和指令怎么使用
    这篇文章主要讲解了“Vue中的调试工具和指令怎么使用”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“Vue中的调试工具和指令怎么使用”吧!vue 的调试工具(1)安装 vue-devtools...
    99+
    2023-06-30
  • Vue中钩子函数怎么用
    小编给大家分享一下Vue中钩子函数怎么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!在Vue 中可以把一系列复杂的操作包装为一...
    99+
    2024-04-02
  • vue中Render函数怎么使用
    这篇文章主要介绍“vue中Render函数怎么使用”,在日常操作中,相信很多人在vue中Render函数怎么使用问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”vue中Render函数怎么使用”的疑惑有所帮助!...
    99+
    2023-07-04
  • jquery中的工具函数有什么类别
    这篇文章主要讲解了“jquery中的工具函数有什么类别”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“jquery中的工具函数有什么类别”吧! ...
    99+
    2024-04-02
  • Java中Arrays数组工具类怎么用
    小编给大家分享一下Java中Arrays数组工具类怎么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!方法一览表方法名简要描述asList()返回由指定数组支持的...
    99+
    2023-06-25
  • JavaScript中的50+个实用工具函数小结
    JavaScript可以做很多出色的事情,本篇文章给大家整理50+个实用工具函数,可以帮助你提高工作效率并可以帮助调试代码 1、isStatic: 检测数据是不是除了symbol外...
    99+
    2024-04-02
  • Vue中的computed函数怎么使用
    这篇“Vue中的computed函数怎么使用”文章的知识点大部分人都不太理解,所以小编给大家总结了以下内容,内容详细,步骤清晰,具有一定的借鉴价值,希望大家阅读完这篇文章能有所收获,下面我们一起来看看这篇“Vue中的computed函数怎么...
    99+
    2023-07-05
  • vue开发使用什么工具
    本教程操作环境:windows7系统、vue3版,DELL G3电脑。vue开发工具1、BootstrapVue用于为 Vuejs 构建 Bootstrap 接口的开源库。链接https://bootstrap-vue.org/2、VueX...
    99+
    2023-05-14
    vue3
  • MySQL中mydumper工具怎么用
    这篇文章给大家分享的是有关MySQL中mydumper工具怎么用的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。 一 前言mydumper 具有如下特性...
    99+
    2024-04-02
  • Python中click工具怎么用
    这篇文章主要介绍了Python中click工具怎么用,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。一、快速开始命令行使用能在运行的时候动态传值让程序做自己想做的事情。现在有一...
    99+
    2023-06-16
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作