@tarojs/components
Version:
28 lines (27 loc) • 1.32 kB
JavaScript
import { h } from '@stencil/core';
import Taro from '@tarojs/taro';
import classNames from 'classnames';
import { isVisible } from '../../utils';
export const TabbarItem = ({ index, isSelected = false, textColor, iconPath, badgeText, showRedDot = false, pagePath, text, onSelect }) => {
const className = classNames('weui-tabbar__item', {
'weui-bar__item_on': isSelected
});
const badgeStyle = {
position: 'absolute',
top: '-2px',
right: '-13px'
};
const dotStyle = {
position: 'absolute',
top: '0',
right: '-6px'
};
function onClick() {
const page = Taro.getCurrentPages().shift();
if (typeof (page === null || page === void 0 ? void 0 : page.onTabItemTap) === 'function' && isVisible(this)) {
page.onTabItemTap({ index, pagePath, text });
}
onSelect(index);
}
return (h("a", { key: index, href: 'javascript:;', class: className, onClick: onClick }, h("span", { style: { display: 'inline-block', position: 'relative' } }, h("img", { src: iconPath, alt: '', class: 'weui-tabbar__icon' }), !!badgeText && (h("span", { class: 'weui-badge taro-tabbar-badge', style: badgeStyle }, badgeText)), showRedDot && (h("span", { class: 'weui-badge weui-badge_dot', style: dotStyle }))), h("p", { class: 'weui-tabbar__label', style: { color: textColor } }, text)));
};