t-web-atom-lib v1.5.0

前端基础库 t-web-atom-lib

1、Install

npm install t-web-atom-lib -S

2、核心功能加载

import {
    DevelopmentEnvEnum,
    Monitorjs,
    tcPubSub,
    tcTrack,
    tcUtils
} from "t-web-atom-lib";

3、支持按需加载

import { DevelopmentEnvEnum } from "t-web-atom-lib/dist/base";
import { base64, imgToBase64 } from "t-web-atom-lib/dist/encryption";
import signalRV1 from "t-web-atom-lib/dist/signalRV1";
import signalRV2 from "t-web-atom-lib/dist/signalRV2";
import Monitorjs from "t-web-atom-lib/dist/monitor";
import tcTrack from "t-web-atom-lib/dist/track";
import tcUtils from "t-web-atom-lib/dist/utils";
import tcPubSub from "t-web-atom-lib/dist/pubsub";
import tcWanXiang from "t-web-atom-lib/dist/wanxiang";

4、Monitorjs 说明

vue版本的前端js监控，封装了之前写的 monitorjs_horse 插件
简化传参，建议在【主入口初始化】时候调用
{
    vue:vue, //将vue类传入，方便做vue错误信息收集
    recordUrl:"" ,//记录日志url地址
    extendsInfo:{    //扩展参数（支持自定义）
        a:"", //自定义信息a（名称可自定义）可参考测试栗子 module
        b:"", //自定义信息b（名称可自定义）
        getDynamic:()=>{  //支持动态传参
            
        }
    }
}

5、pubsub 说明

前端发布订阅模式
tcPubSub.publish(topic,args)  发布消息
tcPubSub.subscribe(topic, func) 订阅事件,返回token
tcPubSub.off(token) 取消订阅
tcPubSub.offAll() 取消所有订阅

6、track 说明

业务逻辑埋点
封装了公司 //vstlog.17usoft.com/vst.ashx 埋点js文件，并实现分类埋点
tcTrack.init();   //初始化埋点信息，建议在【主入口初始化】时候调用
tcTrack.clickTrack(action,label,values) //点击方式埋点
tcTrack.focusTrack(action,label,values) //获得焦点埋点
tcTrack.showTrack(action,label,values) //展示方式埋点
tcTrack.signalRTrack(action,label,values) //signalR 埋点

7、SignalR 通信支持

支持第一版、第二版新老两种SignalR通信方式
无需项目端手动加载通信相关js文件，基础库已经做了封装。

8、base 说明

DevelopmentEnvEnum ：环境枚举值
1.DevelopmentEnvEnum.DEV : "development"
2.DevelopmentEnvEnum.QA : "qa"
3.DevelopmentEnvEnum.STAGE : "stage"
4.DevelopmentEnvEnum.PRODUCT : "product"

9、tcUtils 说明

1.日期类型的转换  format
    对Date的扩展，将 Date 转化为指定格式的String * 月(M)、日(d)、12小时(h)、24小时(H)、分(m)、秒(s)、周(E)、季度(q)
    可以用 1-2 个占位符 * 年(y)可以用 1-4 个占位符，毫秒(S)只能用 1 个占位符(是 1-3 位的数字) * eg: * 
    (new Date()).format("yyyy-MM-dd hh:mm:ss.S")==> 2006-07-02 08:09:04.423      
    (new Date()).format("yyyy-MM-dd E HH:mm:ss") ==> 2009-03-10 二 20:09:04      
    (new Date()).format("yyyy-MM-dd EE hh:mm:ss") ==> 2009-03-10 周二 08:09:04      
    (new Date()).format("yyyy-MM-dd EEE hh:mm:ss") ==> 2009-03-10 星期二 08:09:04      
    (new Date()).format("yyyy-M-d h:m:s.S") ==> 2006-7-2 8:9:4.18

2.trim 字符串去除空格
使用方式："test".trim();

3.lTrim 字符串去除左边空格
使用方式："test".lTrim();

4.rTrim 字符串去除右边空格
使用方式："test".rTrim();

5.getUrlParam 根据参数名称，获取url参数
使用方式： tcUtils.getUrlParam("pageid");

6.getEnv //获取当前开发环境
使用方式： tcUtils.getEnv(); //返回DevelopmentEnvEnum枚举类型（见上面枚举介绍）

8.checkUrl //检测URL
使用方式： tcUtils.checkUrl("https://baidu.com");

9.createdScript //动态创建js文件
使用方式： tcUtils.createdScript("https://baidu.com/a.js");

10.objectToQString  //对象转成 Query String
使用方式： tcUtils.objectToQString({a:1,b:2});

11.cursorPosition   //获取光标位置、在光标处插入值
1） tcUtils.cursorPosition.get(textAreaObj);    //返回位置 rangeData
2） tcUtils.cursorPosition.add(textarea, rangeData, text);    //参数：rangeData

12.compressImage //压缩图片
tcUtils.compressImage(file,callback); //file：file文件   callback：回调函数

13.isWx //是否在微信环境
tcUtils.isWx(); //true 、 false

14.getOsPlatForm  //获取移动端系统类型
tcUtils.getOsPlatForm(); //android 、 iphone

15.checkEmail  //验证邮箱
tcUtils.checkEmail("邮箱地址"); //true 、 false

16.isFunction   //是否是方法
tcUtils.isFunction(func); //true 、 false

17.isNull   //验证字符串是否为空
tcUtils.isNull(str); //true 、 false

10、tcWanxiang 微前端框架子应用接入说明

tcWanxiang.son.init();  //子应用初始化
tcWanxiang.son.isWanxiang();  //判断是否在万象中
tcWanxiang.son.bootstrap(); //加载  返回promise 
tcWanxiang.son.mount(); //渲染  返回promise 
tcWanxiang.son.unmount();   //销毁  返回promise 

tcWanxiang.sonConfig.setOutput();   //设置webpack中的output