> For the complete documentation index, see [llms.txt](https://vuxjs.gitbook.io/vux/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://vuxjs.gitbook.io/vux/ti-shi-zu-jian/actionsheet.md).

# Actionsheet

## Props

| 参数          | 类型      | 默认值    | 说明         |
| ----------- | ------- | ------ | ---------- |
| show        | Boolean | false  | 显示绑定值，双向绑定 |
| show-cancel | Boolean | false  | 是否显示取消按钮   |
| menus       | Object  | {}     | 菜单列表，格式见下  |
| cancelText  | String  | cancel | 取消按钮文字     |

> menus格式如下

```javascript
{
  menu1: 'Take Photo',
  menu2: 'Choose from photos'
}
```

## Events

| 事件名           | 参数                   | 说明      |
| ------------- | -------------------- | ------- |
| on-menu-click | (menuKey, menuValue) | 点击菜单时触发 |
| on-cancel     | --                   | 点击取消时触发 |

## Demo

\`\`\` vux height=400 components=Group,Switch,Actionsheet

&#x20;export default { data () { return { show1:false, menus1:{ menu1: 'Share to friends', menu2: 'Share to timeline' }, show2:false, menus2: { menu1: 'Take Photo', menu2: 'Choose from photos' }, show3:false, menus3: { menu1: 'friends comment' } } }, methods: { click (key) { console.log(key) } } }&#x20;

\`\`\`
