更新记录

1.1.10（2025-04-02） 下载此版本

首次提交

平台兼容性

xiaotian-ui

开发ing...

目录

[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、解析身份证号

参数

返回字段

let res = uni.tCheckIdCard('130701199310302288');
console.log(res);
//  {
//      age: 30
//      city: "张家口市"
//      code: "130701"
//      day: "30"
//      gender: 0
//      month: "10"
//      province: "河北省"
//      town: "市辖区"
//      year: "1993"
//  }

2、倒计时

参数

返回字段

返回：剩余时间

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、时间戳转日期

参数

返回字段

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参数

参数

返回字段

let urlParams = uni.tGetParam('index/index?test=' + 123 + '&name=' + '小明')
console.log(urlParams);
// {
//      name: "小明"
//      test: "123"
// }

5、微信公众号获取code

参数

返回字段

onShow() {
    // 截取url中的code  该方法注意写在onshow中
    uni.tHfiveLogin((e)=>{ 
        console.log(e); // code
    })      
},

// 传qppid拉起授权页面
uni.tHfiveLogin((e)=>{
    console.log(e);
},'wx987c4d003d2cd21eg')

6、请求封装

7、

样式篇

样式说明