Drawer 抽屉

抽屉菜单

使用指南

在 Taro 文件中引入组件

import { AtDrawer } from 'taro-ui'

组件依赖的样式文件（仅按需引用时需要）

@import "~taro-ui/dist/style/components/drawer.scss";
@import "~taro-ui/dist/style/components/list.scss";

用法

<AtDrawer 
  show={this.state.show} 
  mask 
  onClose={this.onClose.bind(this)} 
  items={['菜单1', '菜单2']}
></AtDrawer>

右边弹出

<AtDrawer 
  show={this.state.show} 
  right 
  mask 
  onClose={this.onClose.bind(this)} 
  items={['菜单1', '菜单2']}
></AtDrawer>

自定义内容

<AtDrawer
  show={this.state.show}
  mask
>
  <View className='drawer-item'>优先展示items里的数据</View>
  <View className='drawer-item'>如果items没有数据就会展示children</View>
  <View className='drawer-item'>这是自定义内容 <AtIcon value='home' size='20' /></View>
  <View className='drawer-item'>这是自定义内容</View>
</AtDrawer>

Drawer 参数

Drawer 事件