下拉菜单

html

<div class="demo-line">
    <feng-item-menu :options="iconItems" @change="output" v-model:show="showItemMenu" option-height="35px"
        position="right">
        <feng-button @click="showItemMenu = true">
            <div style="display: flex;gap: 10px;margin-right: 5px;align-items:center;">
                <feng-icon style="margin: 2px;" name="mail"></feng-icon>
                <p style="margin: 0;line-height: 24px;">邮件</p>
            </div>
        </feng-button>
    </feng-item-menu>
</div>

javascript

const iconItems = [
    {
        icon: h(svgIcon, { name: 'send', style: iconItemsStyle }, null),
        text: '发送'
    },
    {
        icon: h(svgIcon, { name: 'eye', style: iconItemsStyle }, null),
        text: '查看',
        items: [
            {
                icon: h(svgIcon, { name: 'delete', style: iconItemsStyle }, null),
                text: '删除'
            },
            {
                icon: h(svgIcon, { name: 'save', style: iconItemsStyle }, null),
                text: '保存'
            },
        ]
    }
]

属性

属性名	说明	默认值
show	是否显示菜单	false
options	选项列表	()=>[]
optionHeight	选项的高度	"max-content"
optionKey	选项的key	""
position	菜单位置	"bottom"

options

属性名	说明
options.icon	选项图标
options.text	选项文本
options.items	子选项

事件

事件名	说明
change	选项改变

插槽

插槽名	说明
default	默认插槽

列表菜单

html

<div class="demo-line">
    <feng-list-menu :options="listMenuOptions1" optionKey="id" v-model:highlightItem="listMenuHighlightItem" @change="output"></feng-list-menu>
</div>

javascript

const listMenuOptions1 = [
    {
        component: h(svgIcon, { name: 'home', style: iconStyle }, null),
        id: 0,
    },
    {
        component: h(svgIcon, { name: 'cut', style: iconStyle }, null),
        id: 1,
    },
    {
        component: h(svgIcon, { name: 'paste', style: iconStyle }, null),
        id: 3,
    }
]
const listMenuHighlightItem = ref(0);

属性

属性名	说明	默认值
highlightItem	选择项	""
options	选项列表	()=>[]
optionKey	选项的key	""

options

属性名	说明
options.component	选项内容
options.id	唯一标识（自定义属性名，与optionKey相同）

事件

事件名	说明
change	选项改变