下拉菜单 Dropdown

基础用法

<template>
  <bp-dropdown @select="handleSelect">
    <bp-button status="gray" type="secondary">下</bp-button>

    <template #content>
      <bp-doption value="1">选项一</bp-doption>
      <bp-doption value="2">选项二</bp-doption>
      <bp-doption value="3">选项三</bp-doption>
      <bp-doption value="4">选项四</bp-doption>
      <bp-doption value="5">选项五</bp-doption>
    </template>
  </bp-dropdown>
</template>

<script setup lang="ts">
const handleSelect = (value: string) => {
  console.log(value);
};
</script>

Dropdown 属性

position	弹出位置	TriggerPosition	bottom	-
trigger	触发方式	TriggerType	click	-

Doption 属性

value	选项值	StringNumber	-	-
disabled	是否禁用	Boolean	-	-

Dropdown 事件

select

选中触发

value?: DoptionValue

-

Dropdown 方法

open	打开下拉	-	-	-
close	关闭下拉	-	-	-

Dropdown 插槽

default	触发区域	-	-
content	下拉内容	-	-

Doption 插槽

default

选项内容

-

-