WGShare.Client.Wx/miniprogram_npm/tdesign-miniprogram/badge
yj dd589f646c 初始化 2024-11-20 17:29:49 +08:00
..
README.en-US.md 初始化 2024-11-20 17:29:49 +08:00
README.md 初始化 2024-11-20 17:29:49 +08:00
badge.d.ts Initial Commit 2024-11-11 14:16:29 +08:00
badge.js Initial Commit 2024-11-11 14:16:29 +08:00
badge.json 初始化 2024-11-20 17:29:49 +08:00
badge.wxml 初始化 2024-11-20 17:29:49 +08:00
badge.wxs 初始化 2024-11-20 17:29:49 +08:00
badge.wxss 初始化 2024-11-20 17:29:49 +08:00
index.d.ts Initial Commit 2024-11-11 14:16:29 +08:00
index.js Initial Commit 2024-11-11 14:16:29 +08:00
props.d.ts Initial Commit 2024-11-11 14:16:29 +08:00
props.js Initial Commit 2024-11-11 14:16:29 +08:00
type.d.ts 初始化 2024-11-20 17:29:49 +08:00
type.js Initial Commit 2024-11-11 14:16:29 +08:00

README.en-US.md

:: BASE_DOC ::

API

Badge Props

name type default description required
style Object - CSS(Cascading Style Sheets) N
custom-style Object - CSS(Cascading Style Sheets)used to set style on virtual component N
color String - - N
content String - - N
count String / Number / Slot 0 see more ts definition N
dot Boolean false - N
max-count Number 99 - N
offset Array - TypescriptArray<string | number> N
shape String circle options: circle/square/bubble/ribbon N
show-zero Boolean false - N
size String medium options: medium/large N

Badge External Classes

className Description
t-class -
t-class-content -
t-class-count -

CSS Variables

The component provides the following CSS variables, which can be used to customize styles.

Name Default Value Description
--td-badge-basic-height 32rpx -
--td-badge-basic-padding 8rpx -
--td-badge-basic-width 32rpx -
--td-badge-bg-color @error-color -
--td-badge-border-radius 4rpx -
--td-badge-bubble-border-radius 20rpx 20rpx 20rpx 1px -
--td-badge-dot-size 16rpx -
--td-badge-font-size @font-size-xs -
--td-badge-font-weight 600 -
--td-badge-large-font-size @font-size-s -
--td-badge-large-height 40rpx -
--td-badge-large-padding 10rpx -
--td-badge-text-color @font-white-1 -