Jff Downmenu

jff-downmenu 下拉菜单

介绍

向下弹出的菜单列表

使用方法

import "../../components/jff-downmenu/jff-downmenu.stml";

例子

    <jff-downmenu 
        @tag-click="tag"
        :left-array="list"
        :right-array="list2"
        activeColor="#12abe7"
        defaultColor="black"
    />
    data() {
        return {
           list: [
                {
                    title: '第一项',
                    id: 1
                },{
                    title: '第二项',
                    id: 2
                },{
                    title: '第三项',
                    id: 3
                }
            ],
            list2:[
                {
                    title: '上架时间',
                    id: 5
                },
                {
                    title: '销售数额',
                    id: 6
                }
            ]

        };
    },
    tag(e){
        console.log(JSON.stringify(e));
    }

props 属性

参数 说明 类型 默认值
active-color 选中状态颜色,选填 String red
default-color 未选中状态颜色,选填 String black
bg-color 选项背景色,选填 String #fff
left-array 左侧选项数据,必填 Array []
right-array 右侧选项数据,必填 Array []
tab-array 菜单数据(菜单数据必须同示例一致),必填 Array []

events 事件

事件名 说明 回调参数
tag-click 点击菜单栏时触发 -
list-click 点击菜单列表项时触发 -
bg-click 点击蒙板关闭时触发 -

参数示例


    /** 菜单示例,ID必须从 1 开始 **/
    tab-array: [
        {
            title: '全部菜单',
            id: 1
        },
        {
            title: '更多菜单',
            id: 2
        }
    ]