[{"value":"预览","id":"预览","hLevel":2,"level":1},{"value":"示例代码","id":"示例代码","hLevel":2,"level":1},{"value":"BadgeProps","id":"badgeprops","hLevel":2,"level":1,"children":[{"value":"appearance?","id":"appearance","hLevel":3,"level":2},{"value":"icon?","id":"icon","hLevel":3,"level":2},{"value":"iconPosition?","id":"iconposition","hLevel":3,"level":2}]},{"value":"类型说明","id":"类型说明","hLevel":2,"level":1,"children":[{"value":"IconSource","id":"iconsource","hLevel":3,"level":2}]}]

Badge

使用 Badge 来突出显示对象的上下文信息，如标签或状态。对象可以是任何有状态或标签的东西，如订单或订阅。

预览

示例代码

render('Checkout::Dynamic::Render', (root) => {
  return <Badge icon="info">Available</Badge>
});

BadgeProps

提示

标注 ? 的属性为可选，未标注 ? 的属性为必选。

appearance?

info warning critical error accent 默认值：info

设置 Badge 的类型。

icon?

IconSource

图标类型。

iconPosition?

start end 默认值：start

图标的位置。start 在前面，end 在后面。

类型说明

IconSource

search arrowDown arrowUp arrowLeft arrowRight calendar cart dot down up right left close closeFill discount info infoFill lock minus plus success successFill store spin bag question email phone share giftcard more timer hook ship location eyeOpen eyeClose menu parcel copy

这篇文章对你有帮助吗？