更新记录

1.0.0(2025-04-24) 下载此版本

初版


平台兼容性

Vue2 Vue3
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
app-vue
钉钉小程序 快手小程序 飞书小程序 京东小程序 鸿蒙元服务
×
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari

x-dropdown

下拉菜单, 自定义下拉菜单

示例

<!-- 基本使用 -->
<x-dropdown :menu-list="['分类1', '分类2', '分类3']" @menu-click="onMenuClick(i)">
    <button type="primary">分类</button>
</x-dropdown>

<!-- 自定义菜单样式 -->
<x-dropdown>
    <button type="primary">分类</button>
    <template #menu>
        <view class="menu f-r-y-c">
            <view class="item" v-for="i in ['分类1', '分类2', '分类3']" @click="onMenuClick(i)">
                {{ i }}
            </view>
        </view>
    </template>
</x-dropdown>

Props

属性名 说明 类型 默认值
menu-list 菜单列表 (使用 menu 插槽后不会显示) String [] ['菜单1', '菜单2', '菜单3']
menuStyle 单个菜单样式 Object {}
interspace 距离点击触发区域距离 [String, Number] 20rpx
customStyle 点击触发区域自定义样式 Object {}

Emits

事件名 说明 回调入参
menuClick 使用 menu-list 配置菜单的点击事件 value:菜单名称, index: 菜单下标

Slots

插槽名 说明
default 点击触发区域
menu 自定义长按菜单

插件如果对你有帮助给个好评吧~

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

暂无用户评论。

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问