## Popup 弹出菜单 ### 使用指南 ``` javascript import { Popup } from 'vant'; Vue.component(Popup.name, Popup); ``` ### 代码演示 #### 基础用法 `popup`默认情况下是从中间弹出。 :::demo 基础用法 ```html 从中间弹出popup 从中间弹出popup ``` ::: #### 从不同位置弹出菜单 可以设置`position`属性，`popup`即能从不同位置弹出，`position`的可选值有`top`，`bottom`，`right`，`left`。 :::demo 从不同位置弹出菜单 ```html 从下方弹出popup 弹出dialog 从上方弹出popup 更新成功 从右方弹出popup 关闭 popup 从左方弹出popup 关闭 popup ``` ::: ### API | 参数 | 说明 | 类型 | 默认值 | 可选值 | |-----------|-----------|-----------|-------------|-------------| | v-model | 当前组件是否显示 | `Boolean` | `false` | - | | overlay | 是否显示背景遮罩层 | `Boolean` | `true` | - | | lockOnScroll | 背景是否跟随滚动 | `Boolean` | `false` | - | | position | 弹出菜单位置 | `String` | - | `top`, `bottom`, `right`, `left` | | closeOnClickOverlay | 点击遮罩层是否关闭弹出菜单 | `Boolean` | `true` | - | | transition | 弹出菜单的`transition` | `String` | `popup-slide` | |