1.1.9 • Published 2 years ago
xiaotian-ui v1.1.9
目录
说明
个人使用,减少项目中冗余代码,不定期更新版本
使用中有任何问题,或者优化意见,欢迎加入交流群讨论
// 微信搜索用户 xiaotian-ui 添加请备注来意 \^o^/特性
提升使用uni-app 开发微信小程序,微信公众号,手机App的速度
封装了常用的CSS,JS,组件
提升开发效率,减少代码体积,优化代码结构
安装&引入^_~
1、使用npm方式安装
npm install xiaotian-ui2、在main.js文件中引入并注册,注意这两行要放在import Vue之后。
import xiaotian from "xiaotian-ui";
Vue.use(xiaotian);3、在pages.json中配置easycom组件模式
"easycom": {
"^t-(.*)": "xiaotian-ui/components/t-$1/t-$1.vue"
},4、引入css样式
<style>
@import "xiaotian-ui/libs/css/index.css";
</style>5、在更目录新建xiaotianConfig.js文件,此文件为全部页面配置文件
一般情况下,请不要修改原有属性
// 自定义初始变量
export let dataC = {
MP_NAME:'盈悦人生小程序',
BASE_URL:'http://yyjk.tjweimob.com/api',
BASE_URL_TWO:'http://yyjk.tjweimob.com/',
}
// 全局onload
export let onLoadC = {
}
// 全局onShow
export let onShowC = {
}
// 全局onReady
export let onReadyC = {
}
// 全局onHide
export let onHideC = {
}
// 全局onUnload
export let onUnload = {
}
// 全局methods
export let methodsC = {
showToastC(title,s = 1000){
uni.showToast({
title,
icon:'none',
mask:true,
duration:s,
})
},
}配置easycom规则后,自动按需引入,无需import组件,直接引用即可。
<template>
<u-button text="按钮"></u-button>
</template>使用方法
按照上述方式安装引入后,配合下方每个方法的详细介绍,方便食用 \^o^/
组件篇
1、自定义头部
2、钟表选择时间段
方法篇
1、解析身份证号
参数
| 参数说明 | 类型 |
|---|---|
| 身份证号 eg:130701199310302288 | String |
返回字段
| 字段 | 表示 |
|---|---|
| province | 省 |
| city | 市 |
| town | 区 |
| year | 出生年 |
| month | 出生月 |
| day | 出生日 |
| age | 年龄 |
| gender | 性别 |
| code | 地区代码 |
let res = uni.tCheckIdCard('130701199310302288');
console.log(res);
// {
// age: 30
// city: "张家口市"
// code: "130701"
// day: "30"
// gender: 0
// month: "10"
// province: "河北省"
// town: "市辖区"
// year: "1993"
// }2、倒计时
参数
| 参数说明 | 类型 |
|---|---|
| 倒计时常(s) | Number |
| 回调函数 | Function |
| 间隔时间 = (1000) | Number |
| 返回文本间距 = ('\u0020') 小间距 / '\u3000' 大间距 | String |
返回字段
| 字段 | 表示 |
|---|---|
| all | 周天时分秒 |
| week | 周 |
| day | 天 |
| hour | 时 |
| minute | 分 |
| second | 秒 |
| sTime | 剩余时间 |
返回:剩余时间
uni.tCountDown(1000000,e => {
console.log(e);
});
// {
// all: "01 04 13 46 40"
// day: "04"
// hour: "13"
// minute: "46"
// sTime: 999999
// second: "40"
// week: "01"
// }3、时间戳转日期
参数
| 参数说明 | 类型 |
|---|---|
| 时间戳(ms 13位) | Number |
返回字段
| 字段 | 表示 |
|---|---|
| all | 年月日时分秒 |
| Dates | 年月日 |
| Times | 时分秒 |
| year | 年 |
| month | 月 |
| day | 日 |
| hour | 时 |
| minute | 分 |
| second | 秒 |
| week | 周 |
let dates = uni.tFormatTime(new Date('2021-12-12').getTime());
console.log(dates);
// {
// Dates: "2021-12-12"
// Times: "08:00:00"
// all: "2021-12-12 08:00:00"
// day: "12"
// hour: "08"
// minute: "00"
// month: "12"
// second: "00"
// week: "07"
// year: 2021
// }4、截取URL参数
参数
| 参数说明 | 类型 |
|---|---|
| 带参URL eg:'index/index?test=' + 123 + '&name=' + '小明' | String |
返回字段
let urlParams = uni.tGetParam('index/index?test=' + 123 + '&name=' + '小明')
console.log(urlParams);
// {
// name: "小明"
// test: "123"
// }5、微信公众号获取code
参数
| 参数说明 | 类型 |
|---|---|
| 回调函数 | Function |
| appId | String |
返回字段
onShow() {
// 截取url中的code 该方法注意写在onshow中
uni.tHfiveLogin((e)=>{
console.log(e); // code
})
},
// 传qppid拉起授权页面
uni.tHfiveLogin((e)=>{
console.log(e);
},'wx987c4d003d2cd21eg')6、请求封装
7、
样式篇
样式说明
1.1.9
2 years ago
1.1.1
2 years ago
1.1.0
2 years ago
1.1.8
2 years ago
1.0.9
2 years ago
1.1.7
2 years ago
1.0.8
2 years ago
1.1.6
2 years ago
1.0.7
2 years ago
1.1.5
2 years ago
1.0.6
2 years ago
1.1.4
2 years ago
1.0.5
2 years ago
1.1.3
2 years ago
1.0.4
2 years ago
1.1.2
2 years ago
1.0.2
3 years ago
1.0.3
3 years ago
1.0.1
3 years ago
1.0.0
3 years ago