2.0.0 • Published 2 years ago

tsunami-common-tools v2.0.0

Weekly downloads
-
License
ISC
Repository
-
Last release
2 years ago

常用js工具

  • 在组件中导入tsunami-common-tools中对应的方法，并选择对应的方法进行导出

  1. 根据给定关键字keyWords过滤树结构数据中包含关键字的节点，并返回新数组

    // 数组中数据格式必须满足各元素的字段中必须包含title、children、key字段，并且key唯一，如[title: '示例标题', key: 123, children: [{...}]]
import {filterTreeNode} from 'tsunami-common-tools'

let newTreeList = filterTreeNode(treeList, '标题')

  2. 根据某个唯一值获取当前唯一值在树数据中对应的所有父节点，使用示例

    // 数组中数据格式必须满足各元素的字段中必须包含title、children、key字段，并且key唯一，如[title: '示例标题', key: 123, children: [{...}]]
import {getParentForKey} from 'tsunami-common-tools'

let parArr = getParentForKey(treeList, 123)

  3. 将树数据转换为一维数组， 使用示例

    // 数据格式必须满足字段属性中存在children
import {generateList} from 'tsunami-common-tools'

let linearArr = []
linearArr = generateList(treeList, linearArr)

  4. 生成随机数，使用示例

    import {randomNumber} from 'tsunami-common-tools'
// 参数为生成几位随机数，传入8，即生成8位随机数
let randomNum = randomNumber(8)

  5. 将指定时间戳转换成日期格式【此方法可以使用moment.js提供的方法代替】使用示例

    import {formatDate} from 'tsunami-common-tools'
// 传入时间戳、要转换的日期格式
let timeStr = formatDate(1640930917282, 'YYYY-MM-DD HH:mm:ss')

  6. 将指定时间戳转换成星期几，使用示例

    import {formatWeek} from 'tsunami-common-tools'
// 传入时间戳
let weekStr = formatWeek(1640930917282)

  7. 将秒转换为【时:分:秒】，通常用于服务器传给前端视频、有音频文件的时长为秒时使用，使用示例

    import {formatTime} from 'tsunami-common-tools'
// 传入秒
let durationStr = formatTime(3600)   // 01:00:00

  8. 将指定时间戳转换成【刚刚、几分钟前、几个小时前、几天前、几周前、几个月前】的格式

    import {formatTimeToZH} from 'tsunami-common-tools'
// 传入时间戳
let str = formatTimeToZH(1640930917282)

  9. 将地址栏参数进行解析，主要用于从其他系统或客户端跳转到当前系统使用

    import {urlFormat} from 'tsunami-common-tools'
let Request = urlFormat()  // Request为地址栏所有参数组成的对象

  10. 将json对象转换为url地址栏格式

    import {jsonToUrl} from 'tsunami-common-tools'
let obj = { a: 1, b: 2 }
let str = jsonToUrl(obj)  str就是转换后的格式，a=1&b=2

  11. 将服务器回传到前端的native编码进行解码处理，多用于提示信息展示。使用示例

    import {decodeUnicode} from 'tsunami-common-tools'
let str = decodeUnicode(res.msg)

  12. 通过文件地址下载文件，使用示例

    import {downloadFile} from 'tsunami-common-tools'
// 传入文件在服务器中的绝对路径进行下载
downloadFile('http://www.baidu.com/zipfile/abc.zip')

  13. 导出流文件，使用示例

    // 下载流文件
import {downloadStreamFile, ab2str} from 'tsunami-common-tools'

// 使用示例
methods: {
    download: () => {
    this.$message.loading('模板下载中...', 0)
    this.$api.downloadFile.exportFile()
        .then(res => {
          if (res.headers['content-type'] !== 'application/json;charset=UTF-8') {
            /**
            * 导出流文件
            * @param that          指向vue的this指针
            * @param response      响应体
            * @param fileName      要修改的文件名
            * @param isTime        文件名是否增加显示时间
            * @param callback      流数据转换成功后的回调
            * @param duration      回调执行的延迟时间
            */
            downloadStreamFile({
              that: this,
              response: res,
              fileName: `${this.moduleName}模板`,
              isTime: false,
              duration: 5,
              callback: () => {
                this.$message.destroy()
              }
            })
          } else {
            /**
            * 导出失败时信息提示
            * @param that        指向vue的this指针
 			* @param response    响应体
            */
            ab2str({
              that: this,
              response: res,
            })
            this.$message.destroy()
          }
        })
        .catch(() => {
          this.$message.destroy()
        })
    }
}

  14. 将arraybuffer流对象转换成字符串，用于导出失败时信息提示【只适用于响应体为流数据】

    import {ab2str} from 'tsunami-common-tools'
let Request = ab2str({that: this, response: res})

  15. 将流文件转换成地址提供预览

    import {openFile} from 'tsunami-common-tools'
this.$api.fileUpload.previewStreamFile('/fileUploadViewer/base/file/download/378').then(res => {
    if (res.headers["content-type"] !== "application/json") {
        let contentType = res.headers["content-type"]
        openFile({
            response: res,
            callback: (href, base64) => {
                console.log(href);    // 用于新标签打开预览
                console.log(base64);  // 用于嵌套iframe预览
            }
        })
    } else {
        ab2str({that: this, response: res})
    }
})

  16. 检测是否是移动端

    import {isMobile750} from 'tsunami-common-tools'
console.log(isMobile750)    // true   or  false

  17. 生成随机uuid

    import {uuid} from 'tsunami-common-tools'
let id = uuid()
// or
let id = uuid(32)

  18. 防抖节流

    import {debounced} from 'tsunami-common-tools'
const getList = () => {
    // do something...
}
debounced(getList)

  19. 深度冻结数据，使数据不在具有响应式。【Object.freeze()为浅冻结】

    import {deepFreeze} from 'tsunami-common-tools'
const obj = {a: 1, b: {name: 'tom'}}
const freeze = deepFreeze(obj)		// 冻结后的数据

  20. 自定义精准判断数据类型。

    返回值 object Null、object Undefined、object Boolean、object String、object Object、object Array、object Function、object Error、object RegExp、object Date等

    import {customTypeOf} from 'tsunami-common-tools'
const params = {title: 1}
const str = customTypeOf(params)  // [object Object]

常用正则表达式

在组件中导入zlit-common-tools对应的正则表达式对象，并选择对应的方法进行导出，以下只是示例，具体用法需要根据代码去做调整。

  1. 密码正则

    import {passwordReg} from 'tsunami-common-tools'
const reg = passwordReg.pattern			// 正则表达式
let tips = passwordReg.message		    // 默认提示信息

  2. 手机号正则

    import {telReg} from 'tsunami-common-tools'
const reg = telReg.pattern			// 正则表达式
let tips = telReg.message		    // 默认提示信息

  3. 固化正则

    import {landlineReg} from 'tsunami-common-tools'
const reg = landlineReg.pattern			// 正则表达式
let tips = landlineReg.message		    // 默认提示信息

  4. 网络地址正则

    import {urlReg} from 'tsunami-common-tools'
const reg = urlReg.pattern			// 正则表达式
let tips = urlReg.message		    // 默认提示信息

  5. 邮箱地址正则

    import {emailReg} from 'tsunami-common-tools'
const reg = emailReg.pattern			// 正则表达式
let tips= emailReg.message		    // 默认提示信息

  6. 只允许输入中文正则

    import {zh_CNReg} from 'tsunami-common-tools'
const reg = zh_CNReg.pattern			// 正则表达式
let tips = zh_CNReg.message		    // 默认提示信息

  7. 真实姓名正则

    import {realNameReg} from 'tsunami-common-tools'
const reg = realNameReg.pattern			// 正则表达式
let tips = realNameReg.message		    // 默认提示信息

  8. 标题正则

    import {titleReg} from 'tsunami-common-tools'
const reg = titleReg.pattern			// 正则表达式
let tips = titleReg.message		    // 默认提示信息

  9. 身份证号正则

    import {IDcardReg} from 'tsunami-common-tools'
const reg = IDcardReg.pattern			// 正则表达式
let tips = IDcardReg.message		    // 默认提示信息
@infinitebrahmanuniverse/nolb-tsu@everything-registry/sub-chunk-2983
2.0.0

2 years ago