操作与导航 / COMPONENT ATLAS
筛选标签页FilterTabs
切换列表的筛选条件,用轻缓移动的底线表达当前选项。
亲手试一试。
01 / LIVE PREVIEWSTATES / 示例状态
当前切换
在左侧预览中体验这枚组件。INTERACTIVE SPECIMEN · 跟随全站主题
用法
02 / USAGE下方展示组件的调用方式。
let mut filter = use_signal(|| "all".to_string());
rsx! {
FilterTabs {
: vec![("all", "全部"), ("published", "已发布")],
: filter(),
: move |value| filter.set(value),
}
}主要属性
03 / PROPERTIES| 属性 / 类型 | 默认值 | 说明 |
|---|---|---|
itemsVec<(&'static str, &'static str)> | 必填 | 选项的值与标签。 |
active_valueString | 必填 | 当前选中的值。 |
on_changeEventHandler<String> | 必填 | 切换后返回新值。 |
操作方式
04 / INTERACTIONTab移动焦点Space / Enter切换筛选