@tarojs/taro-h5 3.4.0-beta.0 → 3.4.0

package/dist/api/ui/interaction/toast.js

@@ -0,0 +1,195 @@
+import { inlineStyle } from '../../utils';
+export default class Toast {
+    constructor() {
+        this.options = {
+            title: '',
+            icon: 'none',
+            image: '',
+            duration: 1500,
+            mask: false
+        };
+        this.style = {
+            maskStyle: {
+                position: 'fixed',
+                'z-index': '1000',
+                top: '0',
+                right: '0',
+                left: '0',
+                bottom: '0'
+            },
+            toastStyle: {
+                'z-index': '5000',
+                'box-sizing': 'border-box',
+                display: 'flex',
+                'flex-direction': 'column',
+                'justify-content': 'center',
+                '-webkit-justify-content': 'center',
+                position: 'fixed',
+                top: '50%',
+                left: '50%',
+                'min-width': '120px',
+                'max-width': '200px',
+                'min-height': '120px',
+                padding: '15px',
+                transform: 'translate(-50%, -50%)',
+                'border-radius': '5px',
+                'text-align': 'center',
+                'line-height': '1.6',
+                color: '#FFFFFF',
+                background: 'rgba(17, 17, 17, 0.7)'
+            },
+            successStyle: {
+                margin: '6px auto',
+                width: '38px',
+                height: '38px',
+                background: 'transparent url(data:image/svg+xml;base64,PHN2ZyB0PSIxNjM5NTQ4OTYzMjA0IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjQzNDgiIHdpZHRoPSIyMDAiIGhlaWdodD0iMjAwIj48cGF0aCBkPSJNMjE5Ljk1MiA1MTIuNTc2bDIxMC40MzIgMjEwLjQzMi00NS4yNDggNDUuMjU2LTIxMC40MzItMjEwLjQzMnoiIHAtaWQ9IjQzNDkiIGZpbGw9IiNmZmZmZmYiPjwvcGF0aD48cGF0aCBkPSJNNzk5LjY3MiAyNjIuMjY0bDQ1LjI1NiA0NS4yNTYtNDYwLjQ2NCA0NjAuNDY0LTQ1LjI1Ni00NS4yNTZ6IiBwLWlkPSI0MzUwIiBmaWxsPSIjZmZmZmZmIj48L3BhdGg+PC9zdmc+) no-repeat',
+                'background-size': '100%'
+            },
+            errrorStyle: {
+                margin: '6px auto',
+                width: '38px',
+                height: '38px',
+                background: 'transparent url(data:image/svg+xml;base64,PHN2ZyB0PSIxNjM5NTUxMDU1MTgzIiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjE0MDc2IiB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCI+PHBhdGggZD0iTTUxMiA2NEMyNjQuNTggNjQgNjQgMjY0LjU4IDY0IDUxMnMyMDAuNTggNDQ4IDQ0OCA0NDggNDQ4LTIwMC41OCA0NDgtNDQ4Uzc1OS40MiA2NCA1MTIgNjR6IG0wIDc1MmEzNiAzNiAwIDEgMSAzNi0zNiAzNiAzNiAwIDAgMS0zNiAzNnogbTUxLjgzLTU1MS45NUw1NDggNjM2YTM2IDM2IDAgMCAxLTcyIDBsLTE1LjgzLTM3MS45NWMtMC4xLTEuMzMtMC4xNy0yLjY4LTAuMTctNC4wNWE1MiA1MiAwIDAgMSAxMDQgMGMwIDEuMzctMC4wNyAyLjcyLTAuMTcgNC4wNXoiIHAtaWQ9IjE0MDc3IiBmaWxsPSIjZmZmZmZmIj48L3BhdGg+PC9zdmc+) no-repeat',
+                'background-size': '100%'
+            },
+            loadingStyle: {
+                margin: '6px auto',
+                width: '38px',
+                height: '38px',
+                '-webkit-animation': 'taroLoading 1s steps(12, end) infinite',
+                animation: 'taroLoading 1s steps(12, end) infinite',
+                background: 'transparent url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjAiIGhlaWdodD0iMTIwIiB2aWV3Qm94PSIwIDAgMTAwIDEwMCI+PHBhdGggZmlsbD0ibm9uZSIgZD0iTTAgMGgxMDB2MTAwSDB6Ii8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTlFOUU5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAgLTMwKSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iIzk4OTY5NyIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgzMCAxMDUuOTggNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjOUI5OTlBIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDYwIDc1Ljk4IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0EzQTFBMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSg5MCA2NSA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNBQkE5QUEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoMTIwIDU4LjY2IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0IyQjJCMiIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgxNTAgNTQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjQkFCOEI5IiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKDE4MCA1MCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDMkMwQzEiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTE1MCA0NS45OCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNDQkNCQ0IiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTEyMCA0MS4zNCA2NSkiLz48cmVjdCB3aWR0aD0iNyIgaGVpZ2h0PSIyMCIgeD0iNDYuNSIgeT0iNDAiIGZpbGw9IiNEMkQyRDIiIHJ4PSI1IiByeT0iNSIgdHJhbnNmb3JtPSJyb3RhdGUoLTkwIDM1IDY1KSIvPjxyZWN0IHdpZHRoPSI3IiBoZWlnaHQ9IjIwIiB4PSI0Ni41IiB5PSI0MCIgZmlsbD0iI0RBREFEQSIgcng9IjUiIHJ5PSI1IiB0cmFuc2Zvcm09InJvdGF0ZSgtNjAgMjQuMDIgNjUpIi8+PHJlY3Qgd2lkdGg9IjciIGhlaWdodD0iMjAiIHg9IjQ2LjUiIHk9IjQwIiBmaWxsPSIjRTJFMkUyIiByeD0iNSIgcnk9IjUiIHRyYW5zZm9ybT0icm90YXRlKC0zMCAtNS45OCA2NSkiLz48L3N2Zz4=) no-repeat',
+                'background-size': '100%'
+            },
+            imageStyle: {
+                margin: '6px auto',
+                width: '40px',
+                height: '40px',
+                background: 'transparent no-repeat',
+                'background-size': '100%'
+            },
+            textStyle: {
+                margin: '0',
+                'font-size': '16px'
+            }
+        };
+    }
+    create(options = {}, _type = 'toast') {
+        // style
+        const { maskStyle, toastStyle, successStyle, errrorStyle, loadingStyle, imageStyle, textStyle } = this.style;
+        // configuration
+        const config = {
+            ...this.options,
+            ...options,
+            _type
+        };
+        // wrapper
+        this.el = document.createElement('div');
+        this.el.className = 'taro__toast';
+        this.el.style.opacity = '0';
+        this.el.style.transition = 'opacity 0.1s linear';
+        // mask
+        this.mask = document.createElement('div');
+        this.mask.setAttribute('style', inlineStyle(maskStyle));
+        this.mask.style.display = config.mask ? 'block' : 'none';
+        // icon
+        this.icon = document.createElement('p');
+        if (config.image) {
+            this.icon.setAttribute('style', inlineStyle({
+                ...imageStyle,
+                'background-image': `url(${config.image})`
+            }));
+        }
+        else {
+            const iconStyle = config.icon === 'loading' ? loadingStyle : config.icon === 'error' ? errrorStyle : successStyle;
+            this.icon.setAttribute('style', inlineStyle({
+                ...iconStyle,
+                ...(config.icon === 'none' ? { display: 'none' } : {})
+            }));
+        }
+        // toast
+        this.toast = document.createElement('div');
+        this.toast.setAttribute('style', inlineStyle({
+            ...toastStyle,
+            ...(config.icon === 'none' ? {
+                'min-height': '0',
+                padding: '10px 15px'
+            } : {})
+        }));
+        // title
+        this.title = document.createElement('p');
+        this.title.setAttribute('style', inlineStyle(textStyle));
+        this.title.textContent = config.title;
+        // result
+        this.toast.appendChild(this.icon);
+        this.toast.appendChild(this.title);
+        this.el.appendChild(this.mask);
+        this.el.appendChild(this.toast);
+        // show immediately
+        document.body.appendChild(this.el);
+        setTimeout(() => { this.el.style.opacity = '1'; }, 0);
+        this.type = config._type;
+        // disappear after duration
+        config.duration >= 0 && this.hide(config.duration, this.type);
+        return '';
+    }
+    show(options = {}, _type = 'toast') {
+        const config = {
+            ...this.options,
+            ...options,
+            _type
+        };
+        if (this.hideOpacityTimer)
+            clearTimeout(this.hideOpacityTimer);
+        if (this.hideDisplayTimer)
+            clearTimeout(this.hideDisplayTimer);
+        // title
+        this.title.textContent = config.title || '';
+        // mask
+        this.mask.style.display = config.mask ? 'block' : 'none';
+        // image
+        const { toastStyle, successStyle, errrorStyle, loadingStyle, imageStyle } = this.style;
+        if (config.image) {
+            this.icon.setAttribute('style', inlineStyle({
+                ...imageStyle,
+                'background-image': `url(${config.image})`
+            }));
+        }
+        else {
+            if (!config.image && config.icon) {
+                const iconStyle = config.icon === 'loading' ? loadingStyle : config.icon === 'error' ? errrorStyle : successStyle;
+                this.icon.setAttribute('style', inlineStyle({
+                    ...iconStyle,
+                    ...(config.icon === 'none' ? { display: 'none' } : {})
+                }));
+            }
+        }
+        // toast
+        this.toast.setAttribute('style', inlineStyle({
+            ...toastStyle,
+            ...(config.icon === 'none' ? {
+                'min-height': '0',
+                padding: '10px 15px'
+            } : {})
+        }));
+        // show
+        this.el.style.display = 'block';
+        setTimeout(() => { this.el.style.opacity = '1'; }, 0);
+        this.type = config._type;
+        // disappear after duration
+        config.duration >= 0 && this.hide(config.duration, this.type);
+        return '';
+    }
+    hide(duration = 0, type) {
+        if (this.type !== type)
+            return;
+        if (this.hideOpacityTimer)
+            clearTimeout(this.hideOpacityTimer);
+        if (this.hideDisplayTimer)
+            clearTimeout(this.hideDisplayTimer);
+        this.hideOpacityTimer = setTimeout(() => {
+            this.el.style.opacity = '0';
+            this.hideDisplayTimer = setTimeout(() => { this.el.style.display = 'none'; }, 100);
+        }, duration);
+    }
+}

package/dist/api/ui/menu.js

@@ -0,0 +1,3 @@
+import { temporarilyNotSupport } from '../utils';
+// 菜单
+export const getMenuButtonBoundingClientRect = temporarilyNotSupport('getMenuButtonBoundingClientRect');

package/dist/api/ui/navigation-bar/index.js

@@ -0,0 +1,42 @@
+import { MethodHandler } from '../../utils/handler';
+import { getParameterError, shouldBeObject, temporarilyNotSupport } from '../../utils';
+// 导航栏
+export const showNavigationBarLoading = temporarilyNotSupport('showNavigationBarLoading');
+export function setNavigationBarTitle(options) {
+    // options must be an Object
+    const isObject = shouldBeObject(options);
+    if (!isObject.flag) {
+        const res = { errMsg: `setNavigationBarTitle:fail ${isObject.msg}` };
+        console.error(res.errMsg);
+        return Promise.reject(res);
+    }
+    const { title, success, fail, complete } = options;
+    const handle = new MethodHandler({ name: 'setNavigationBarTitle', success, fail, complete });
+    if (!title || typeof title !== 'string') {
+        return handle.fail({
+            errMsg: getParameterError({
+                para: 'title',
+                correct: 'String',
+                wrong: title
+            })
+        });
+    }
+    if (document.title !== title) {
+        document.title = title;
+    }
+    return handle.success();
+}
+/**
+ * 设置页面导航条颜色
+ */
+export const setNavigationBarColor = (options) => {
+    const { backgroundColor, success, fail, complete } = options;
+    const handle = new MethodHandler({ name: 'setNavigationBarColor', success, fail, complete });
+    const meta = document.createElement('meta');
+    meta.setAttribute('name', 'theme-color');
+    meta.setAttribute('content', backgroundColor);
+    document.head.appendChild(meta);
+    return handle.success();
+};
+export const hideNavigationBarLoading = temporarilyNotSupport('hideNavigationBarLoading');
+export const hideHomeButton = temporarilyNotSupport('hideHomeButton');

package/dist/api/ui/pull-down-refresh.js

@@ -0,0 +1,26 @@
+import Taro from '@tarojs/api';
+import { MethodHandler } from '../utils/handler';
+/**
+ * 开始下拉刷新。调用后触发下拉刷新动画，效果与用户手动下拉刷新一致。
+ */
+export const startPullDownRefresh = function ({ success, fail, complete } = {}) {
+    const handle = new MethodHandler({ name: 'startPullDownRefresh', success, fail, complete });
+    return new Promise((resolve, reject) => {
+        Taro.eventCenter.trigger('__taroStartPullDownRefresh', {
+            successHandler: (res = {}) => handle.success(res, resolve),
+            errorHandler: (res = {}) => handle.fail(res, reject)
+        });
+    });
+};
+/**
+ * 停止当前页面下拉刷新。
+ */
+export const stopPullDownRefresh = function ({ success, fail, complete } = {}) {
+    const handle = new MethodHandler({ name: 'stopPullDownRefresh', success, fail, complete });
+    return new Promise((resolve, reject) => {
+        Taro.eventCenter.trigger('__taroStopPullDownRefresh', {
+            successHandler: (res = {}) => handle.success(res, resolve),
+            errorHandler: (res = {}) => handle.fail(res, reject)
+        });
+    });
+};

package/dist/api/ui/scroll/index.js

@@ -0,0 +1,83 @@
+import { Current } from '@tarojs/runtime';
+import { MethodHandler } from '../../utils/handler';
+import { getTimingFunc, easeInOut } from '../../utils';
+let timer;
+const FRAME_DURATION = 17;
+/**
+ * 将页面滚动到目标位置
+ */
+export const pageScrollTo = ({ scrollTop, selector = '', duration = 300, success, fail, complete }) => {
+    let scrollFunc;
+    const handle = new MethodHandler({ name: 'pageScrollTo', success, fail, complete });
+    return new Promise((resolve, reject) => {
+        var _a;
+        try {
+            if (scrollTop === undefined && !selector) {
+                return handle.fail({
+                    errMsg: 'scrollTop" 或 "selector" 需要其之一'
+                }, reject);
+            }
+            const id = (_a = Current.page) === null || _a === void 0 ? void 0 : _a.path;
+            const el = (id
+                ? document.getElementById(id)
+                : document.querySelector('.taro_page') ||
+                    document.querySelector('.taro_router'));
+            if (!scrollFunc) {
+                if (!el) {
+                    scrollFunc = pos => {
+                        if (pos === undefined) {
+                            return window.pageYOffset;
+                        }
+                        else {
+                            window.scrollTo(0, pos);
+                        }
+                    };
+                }
+                else {
+                    scrollFunc = pos => {
+                        if (pos === undefined) {
+                            return el.scrollTop;
+                        }
+                        else {
+                            el.scrollTop = pos;
+                        }
+                    };
+                }
+            }
+            if (scrollTop && selector) {
+                console.warn('"scrollTop" 或 "selector" 建议只设一个值，全部设置会忽略selector');
+            }
+            const from = scrollFunc();
+            let to;
+            if (typeof scrollTop === 'number') {
+                to = scrollTop;
+            }
+            else {
+                const el = document.querySelector(selector);
+                to = (el === null || el === void 0 ? void 0 : el.offsetTop) || 0;
+            }
+            const delta = to - from;
+            const frameCnt = duration / FRAME_DURATION;
+            const easeFunc = getTimingFunc(easeInOut, frameCnt);
+            const scroll = (frame = 0) => {
+                const dest = from + delta * easeFunc(frame);
+                scrollFunc(dest);
+                if (frame < frameCnt) {
+                    timer && clearTimeout(timer);
+                    timer = setTimeout(() => {
+                        scroll(frame + 1);
+                    }, FRAME_DURATION);
+                }
+                else {
+                    return handle.success({}, resolve);
+                }
+            };
+            scroll();
+        }
+        catch (e) {
+            return handle.fail({
+                errMsg: e.message
+            }, reject);
+        }
+    });
+};

package/dist/api/ui/sticky.js

@@ -0,0 +1,3 @@
+import { temporarilyNotSupport } from '../utils';
+// 置顶
+export const setTopBarText = temporarilyNotSupport('setTopBarText');

package/dist/api/ui/tab-bar.js

@@ -0,0 +1,282 @@
+import Taro from '@tarojs/api';
+import { shouldBeObject, getParameterError, isValidColor } from '../utils';
+import { MethodHandler } from '../utils/handler';
+let tabConf;
+export function initTabBarApis(config = {}) {
+    tabConf = config.tabBar;
+}
+/**
+ * 显示 tabBar 某一项的右上角的红点
+ */
+export const showTabBarRedDot = (options) => {
+    // options must be an Object
+    const isObject = shouldBeObject(options);
+    if (!isObject.flag) {
+        const res = { errMsg: `showTabBarRedDot:fail ${isObject.msg}` };
+        console.error(res.errMsg);
+        return Promise.reject(res);
+    }
+    const { index, success, fail, complete } = options;
+    const handle = new MethodHandler({ name: 'showTabBarRedDot', success, fail, complete });
+    if (typeof index !== 'number') {
+        return handle.fail({
+            errMsg: getParameterError({
+                para: 'index',
+                correct: 'Number',
+                wrong: index
+            })
+        });
+    }
+    return new Promise((resolve, reject) => {
+        Taro.eventCenter.trigger('__taroShowTabBarRedDotHandler', {
+            index,
+            successHandler: (res = {}) => handle.success(res, resolve),
+            errorHandler: (res = {}) => handle.fail(res, reject)
+        });
+    });
+};
+/**
+ * 显示 tabBar
+ */
+export const showTabBar = (options = {}) => {
+    // options must be an Object
+    const isObject = shouldBeObject(options);
+    if (!isObject.flag) {
+        const res = { errMsg: `showTabBar:fail ${isObject.msg}` };
+        console.error(res.errMsg);
+        return Promise.reject(res);
+    }
+    const { animation, success, fail, complete } = options;
+    const handle = new MethodHandler({ name: 'showTabBar', success, fail, complete });
+    if (options.hasOwnProperty('animation') && typeof animation !== 'boolean') {
+        return handle.fail({
+            errMsg: getParameterError({
+                para: 'animation',
+                correct: 'Boolean',
+                wrong: animation
+            })
+        });
+    }
+    return new Promise((resolve, reject) => {
+        Taro.eventCenter.trigger('__taroShowTabBar', {
+            animation,
+            successHandler: (res = {}) => handle.success(res, resolve),
+            errorHandler: (res = {}) => handle.fail(res, reject)
+        });
+    });
+};
+/**
+ * 动态设置 tabBar 的整体样式
+ */
+export const setTabBarStyle = (options = {}) => {
+    // options must be an Object
+    const isObject = shouldBeObject(options);
+    if (!isObject.flag) {
+        const res = { errMsg: `setTabBarStyle:fail ${isObject.msg}` };
+        console.error(res.errMsg);
+        return Promise.reject(res);
+    }
+    const { color, selectedColor, backgroundColor, borderStyle, success, fail, complete } = options;
+    const handle = new MethodHandler({ name: 'setTabBarStyle', success, fail, complete });
+    let errMsg;
+    if (color && !isValidColor(color)) {
+        errMsg = 'color';
+    }
+    else if (selectedColor && !isValidColor(selectedColor)) {
+        errMsg = 'selectedColor';
+    }
+    else if (backgroundColor && !isValidColor(backgroundColor)) {
+        errMsg = 'backgroundColor';
+    }
+    else if (borderStyle && !/^(black|white)$/.test(borderStyle)) {
+        errMsg = 'borderStyle';
+    }
+    if (errMsg) {
+        return handle.fail({ errMsg: `invalid ${errMsg}` });
+    }
+    if (!tabConf) {
+        return handle.fail();
+    }
+    const obj = {};
+    if (color)
+        obj.color = color;
+    if (selectedColor)
+        obj.selectedColor = selectedColor;
+    if (backgroundColor)
+        obj.backgroundColor = backgroundColor;
+    if (borderStyle)
+        obj.borderStyle = borderStyle;
+    return new Promise((resolve, reject) => {
+        Taro.eventCenter.trigger('__taroSetTabBarStyle', {
+            color,
+            selectedColor,
+            backgroundColor,
+            borderStyle,
+            successHandler: (res = {}) => handle.success(res, resolve),
+            errorHandler: (res = {}) => handle.fail(res, reject)
+        });
+    });
+};
+/**
+ * 动态设置 tabBar 某一项的内容
+ */
+export const setTabBarItem = (options) => {
+    // options must be an Object
+    const isObject = shouldBeObject(options);
+    if (!isObject.flag) {
+        const res = { errMsg: `setTabBarItem:fail ${isObject.msg}` };
+        console.error(res.errMsg);
+        return Promise.reject(res);
+    }
+    const { index, text, iconPath, selectedIconPath, success, fail, complete } = options;
+    const handle = new MethodHandler({ name: 'setTabBarItem', success, fail, complete });
+    if (typeof index !== 'number') {
+        return handle.fail({
+            errMsg: getParameterError({
+                para: 'index',
+                correct: 'Number',
+                wrong: index
+            })
+        });
+    }
+    return new Promise((resolve, reject) => {
+        Taro.eventCenter.trigger('__taroSetTabBarItem', {
+            index,
+            text,
+            iconPath,
+            selectedIconPath,
+            successHandler: (res = {}) => handle.success(res, resolve),
+            errorHandler: (res = {}) => handle.fail(res, reject)
+        });
+    });
+};
+/**
+ * 为 tabBar 某一项的右上角添加文本
+ */
+export const setTabBarBadge = (options) => {
+    // options must be an Object
+    const isObject = shouldBeObject(options);
+    if (!isObject.flag) {
+        const res = { errMsg: `setTabBarBadge:fail ${isObject.msg}` };
+        console.error(res.errMsg);
+        return Promise.reject(res);
+    }
+    const { index, text, success, fail, complete } = options;
+    const handle = new MethodHandler({ name: 'setTabBarBadge', success, fail, complete });
+    if (typeof index !== 'number') {
+        return handle.fail({
+            errMsg: getParameterError({
+                para: 'index',
+                correct: 'Number',
+                wrong: index
+            })
+        });
+    }
+    if (typeof text !== 'string') {
+        return handle.fail({
+            errMsg: getParameterError({
+                para: 'text',
+                correct: 'String',
+                wrong: text
+            })
+        });
+    }
+    return new Promise((resolve, reject) => {
+        Taro.eventCenter.trigger('__taroSetTabBarBadge', {
+            index,
+            text,
+            successHandler: (res = {}) => handle.success(res, resolve),
+            errorHandler: (res = {}) => handle.fail(res, reject)
+        });
+    });
+};
+/**
+ * 移除 tabBar 某一项右上角的文本
+ */
+export const removeTabBarBadge = (options) => {
+    // options must be an Object
+    const isObject = shouldBeObject(options);
+    if (!isObject.flag) {
+        const res = { errMsg: `removeTabBarBadge:fail ${isObject.msg}` };
+        console.error(res.errMsg);
+        return Promise.reject(res);
+    }
+    const { index, success, fail, complete } = options;
+    const handle = new MethodHandler({ name: 'removeTabBarBadge', success, fail, complete });
+    if (typeof index !== 'number') {
+        return handle.fail({
+            errMsg: getParameterError({
+                para: 'index',
+                correct: 'Number',
+                wrong: index
+            })
+        });
+    }
+    return new Promise((resolve, reject) => {
+        Taro.eventCenter.trigger('__taroRemoveTabBarBadge', {
+            index,
+            successHandler: (res = {}) => handle.success(res, resolve),
+            errorHandler: (res = {}) => handle.fail(res, reject)
+        });
+    });
+};
+/**
+ * 隐藏 tabBar 某一项的右上角的红点
+ */
+export const hideTabBarRedDot = (options) => {
+    // options must be an Object
+    const isObject = shouldBeObject(options);
+    if (!isObject.flag) {
+        const res = { errMsg: `hideTabBarRedDot:fail ${isObject.msg}` };
+        console.error(res.errMsg);
+        return Promise.reject(res);
+    }
+    const { index, success, fail, complete } = options;
+    const handle = new MethodHandler({ name: 'hideTabBarRedDot', success, fail, complete });
+    if (typeof index !== 'number') {
+        return handle.fail({
+            errMsg: getParameterError({
+                para: 'index',
+                correct: 'Number',
+                wrong: index
+            })
+        });
+    }
+    return new Promise((resolve, reject) => {
+        Taro.eventCenter.trigger('__taroHideTabBarRedDotHandler', {
+            index,
+            successHandler: (res = {}) => handle.success(res, resolve),
+            errorHandler: (res = {}) => handle.fail(res, reject)
+        });
+    });
+};
+/**
+ * 隐藏 tabBar
+ */
+export const hideTabBar = (options = {}) => {
+    // options must be an Object
+    const isObject = shouldBeObject(options);
+    if (!isObject.flag) {
+        const res = { errMsg: `hideTabBar:fail ${isObject.msg}` };
+        console.error(res.errMsg);
+        return Promise.reject(res);
+    }
+    const { animation, success, fail, complete } = options;
+    const handle = new MethodHandler({ name: 'hideTabBar', success, fail, complete });
+    if (options.hasOwnProperty('animation') && typeof animation !== 'boolean') {
+        return handle.fail({
+            errMsg: getParameterError({
+                para: 'animation',
+                correct: 'Boolean',
+                wrong: animation
+            })
+        });
+    }
+    return new Promise((resolve, reject) => {
+        Taro.eventCenter.trigger('__taroHideTabBar', {
+            animation,
+            successHandler: (res = {}) => handle.success(res, resolve),
+            errorHandler: (res = {}) => handle.fail(res, reject)
+        });
+    });
+};

package/dist/api/ui/window.js

@@ -0,0 +1,31 @@
+import { temporarilyNotSupport } from '../utils';
+import { CallbackManager } from '../utils/handler';
+const callbackManager = new CallbackManager();
+const resizeListener = () => {
+    callbackManager.trigger({
+        windowWidth: window.screen.width,
+        windowHeight: window.screen.height
+    });
+};
+/**
+ * 设置窗口大小，该接口仅适用于 PC 平台，使用细则请参见指南
+ */
+export const setWindowSize = temporarilyNotSupport('setWindowSize');
+/**
+ * 监听窗口尺寸变化事件
+ */
+export const onWindowResize = callback => {
+    callbackManager.add(callback);
+    if (callbackManager.count() === 1) {
+        window.addEventListener('resize', resizeListener);
+    }
+};
+/**
+ * 取消监听窗口尺寸变化事件
+ */
+export const offWindowResize = callback => {
+    callbackManager.remove(callback);
+    if (callbackManager.count() === 0) {
+        window.removeEventListener('resize', resizeListener);
+    }
+};