tools-library v1.1.12

安装

$ npm i tools-library -save  
$ yarn add tools-library

使用 自定义拖动指令（支持pc、移动端） main.js

部分导入

import { directiveMoveScale } from 'tools-library'
app.directive('moveScale', directiveMoveScale)

全部导入

import { tools } from 'tools-library'
app.directive('moveScale', tools.directiveMoveScale)

组件中使用：

<div v-move-scale></div>

配置参数

none

使用 自定义放大镜指令（支持pc）

全局部分导入

import { directiveMagnifier } from 'tools-library'
app.directive('mag', directiveMagnifier)

全局全部导入

import { tools } from 'tools-library'
app.directive('mag', tools.directiveMagnifier)

组件中使用：

<div v-mag></div>

组件内部分导入

import { directiveMagnifier } from 'tools-library'
const vMag = directiveMagnifier

组件内全局全部导入

import { tools } from 'tools-library'
const vMag = tools.directiveMagnifier

组件中使用：

<div v-mag="params"></div>

配置参数

params: {
  magnifierSize: '100px', // 放大镜大小（单位px）
  borderColor: '#e1d5d5', // 放大镜边框颜色
  circular: false, // 放大镜是否设置为圆
  scale: 2 // 放大镜放大倍数
}

使用 自定义格式化方法

部分导入

import { formatTime } from 'tools-library'

全部导入

import { tools } from 'tools-library'

组件中使用：

formatTime(time, tFormat)
// 或
tools.formatTime(time, tFormat)

配置参数

time：
类型：
number 时间戳 Date 时间格式 string 字符串时间戳
tFormat：
类型：
string 格式化字符串模板
default: 'yyyy-MM-dd HH:mm:ss'

使用 自定义websocket方法

部分导入

import { WS } from 'tools-library'

全部导入

import { tools } from 'tools-library'

组件中使用：

new WS(config)
// 或
new tools.WS(config)

配置参数

config：
类型：
object ws配置对象
config: {
  url: '',
  autoReconnectInterval: 5000, // 自动重连间隔
  maxReconnectSum： 3, // 最大重连次数
  enableHeartbeat: true, // 启用心跳
  heartbeatInterval: 30000, // 心跳间隔
  heartbeatData: 'ping', // 发送心跳数据
  message: msg => {}, // 接收消息回调
  error: err => {}, // 错误回调
  close: () => {}, // 关闭回调
}
// 关闭websocket
ws.close()

使用 自定义indexDb方法

部分导入

import { IndexDb } from 'tools-library'

全部导入

import { tools } from 'tools-library'

组件中使用：

await IndexDb.openDB(dbName, version = 1, newStore)
// 或
await tools.IndexDb.openDB(dbName, version = 1, newStore)

使用方法

// 打开数据库/创建数据库
// newStore { name: '', id: '', index: [ { indexName: '索引名称', name: '列属性', unique: false } ] } name 表名 id 主键（为空自增） index 自定义索引对象
openDB(dbName, version = 1, newStore)
// 添加数据
// data { array } / { object }
addData(db, storeName, data)
// 更新数据
// data { array } / { object }
updateData(db, storeName, data)
// 通过主键查询数据
getDataByKey(db, storeName, key)
// 通过自定义索引查询数据
getDataByIndex(db, storeName, indexName, indexValue)
// 通过游标查询所有数据
cursorGetAllData(db, storeName)
// 通过游标自定义索引查询所有数据
cursorGetDataByIndex(db, storeName, indexName, indexValue)
// 删除数据
deleteData(db, storeName, key)
// 清空数据
clearData(db, storeName)
// 删除数据库
deleteDb(dbName)
// 关闭数据库
closeDB(db)
// 注：除关闭数据库方法外，其他方法返回值为promise

使用 自定义fileBase64方法

部分导入

import { fileBase64 } from 'tools-library'

全部导入

import { tools } from 'tools-library'

组件中使用：

await fileBase64.urlToBase64(url)
// 或
await tools.fileBase64.urlToBase64(url)

使用方法

// 将base64转化为blob
base64ToBlob(base64)
// 将blob转化为File
blobToFile(blob, fileName)
// 将base64转化为File
base64ToFile(base64, fileName)
// 通过图片url地址转化为base64
urlToBase64(url)
// 将File转化为blob
fileToBlob(file)
// 将blob转化为base64
blobToBase64(blob)
// 将file转化为base64
fileToBase64(file)

使用 自定义Encry方法

部分导入

import { Encry } from 'tools-library'

全部导入

import { tools } from 'tools-library'

组件中使用：

Encry.encrypt(key, text)
Encry.decrypt(key, text)
// 或
tools.Encry.encrypt(key, text)
tools.Encry.decrypt(key, text)

使用方法

// 加密方法 key（密钥）必须为数字字母组成的36位字符串 text为要加密的字符串
Encry.encrypt(key, text)
// 解密方法 key（密钥）必须为数字字母组成的36位字符串 text为要解密的字符串
Encry.decrypt(key, text)

使用 本地媒体组件 main.js

部分导入

import { LocalMedia } from 'tools-library'
app.use(LocalMedia)

全部导入

import { components } from 'tools-library'
app.use(components)

组件中使用：

<LocalMedia />

配置参数 videoConfig: { ... } getUserMedia(videoConfig)

默认配置

videoConfig: {
  width: 320,
  height: 240,
  video: {
    facingMode: 'user'
  }
}