目录

[TOC]

说明

个人使用，减少项目中冗余代码，不定期更新版本

使用中有任何问题，或者优化意见，欢迎加入交流群讨论

// 微信搜索用户 xiaotian-ui 添加请备注来意 \^o^/

特性

提升使用uni-app 开发微信小程序，微信公众号，手机App的速度

封装了常用的CSS,JS,组件

提升开发效率，减少代码体积，优化代码结构

安装&引入^_~

1、使用npm方式安装

npm install xiaotian-ui

2、在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、

样式篇

样式说明