简介

fs-drawer 组件用于页面侧边弹出抽屉，支持左/右方向、菜单、标题、关闭按钮、slot 内容等，适用于导航、功能菜单、内容展示等场景。

使用方法

局部引入，在需要引入的页面或组件的 index.json 中配置：

"usingComponents": {
  "fs-drawer": "ava-ui/fxui/fs-drawer/index"
}

代码演示

1. 基础用法

API

属性

属性名	说明	类型	可选值/格式	默认值
show	是否显示抽屉	boolean	true/false	false
position	抽屉方向	string	left/right	left
title	抽屉标题	string	—	''
menu	菜单项	array	[{icon, text, showArrow}]	[]
showClose	显示关闭按钮	boolean	true/false	false
width	抽屉宽度	string	例如 '355px'	最大宽度屏幕的90%
extStyle	外部样式	string	—	''

Slot

名称	说明
默认	抽屉内容区

事件

事件名	说明	回调参数
close	关闭抽屉	event
menuClick	点击菜单项

设计说明

• 支持左/右两侧弹出，圆角、阴影、宽度可配置。
• 菜单项支持 icon+文本，支持 showArrow 控制是否显示箭头，slot 支持自定义内容。
• 关闭按钮可选，菜单点击有高亮反馈。
• 变量全部用 var.wxss，风格统一。

打开预览