0.0.9 • Published 8 years ago
mc-libs v0.0.9
VUE工具开发
#bash
npm install mc-libs//main.js
import utils from 'mc-libs'
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请求成功返回的结果
}
})