0.0.6 • Published 6 years ago
teo-utils v0.0.6
VUE工具开发
#bash
npm install teo-utils --save
//main.js
import utils from 'tui-utils'
Vue.use(utils)
Smart-Img.vue 智能裁剪
在不能完全展示图片全尺寸的情况下,图片将智能选区,自动裁剪最佳区域并生成一张新图
生成的为canvas图,且高宽都为100%,所以父容器需要固定高宽
<!-- xxx.vue -->
<Smart-Img :imgURL='imgURL' :cropWidth="width" :cropHeight="height"></Smart-Img>
参数 | 说明 | 类型 |
---|---|---|
imgURL | 图片地址 | String |
cropWidth | 裁剪宽度 | Number |
cropHeight | 裁剪高度 | Number |
v-scroll-text 指令
文本溢出时自动左右来回滚动
div 需要有固定的宽度
<!-- xxx.vue -->
<div v-scroll-text:speed="text"></div>
参数 | 说明 | 类型 |
---|---|---|
v-scroll-text | 滚动指令 | String |
text | 纯文本 | String |
speed | 速度/毫秒(可选) | Number |
通用对话框
- 通用的对话框,需自定义宽度和居中
<!-- xxx.vue -->
<Tui-Dialog :show.sync="绑定显示属性" @on-hide="关闭事件">这里放自定义内容</Tui-Dialog>
请求后缓存
- 基于axios修改的
// 用法
this.$storage({
name: '缓存名[必选]',
type: 'local || session 缓存类型[默认session]',
timeout: '1000 过期时间[毫秒],[默认7天]',
url: 'axios请求地址[必选]',
httpType: 'get || post 请求类型[默认get]',
params: 'axios请求参数,按axios格式[可选]',
status: 'err_code=200[必选]',
success: (res) => {
// res为axios请求成功返回的结果
}
})