Components

vc-dropdown

Install

npm install vc-dropdown --save
// build version
import vcDropdown from 'vc-dropdown'
// recommend for *.vue project for small bundle size
import vcDropdown from 'vc-dropdown/src/Dropdown.vue'
// commonjs
require('./dist/build.min.js')
// script tag
<script src='./dist/build.min.js'></script>

Usage

props

label

open

onClick

example

import Vue from 'vue'
import vcDropdown from '../dist/build.js'
new Vue({
    el: '#app',
    data () {
        return {
            bools: {
                'true': true,
                'false': false
            },
            useSlot: true,
            label: '下拉菜单',
            open: true,
            customClick (value) {
                alert('自定义点击回调, value = ' + value)
                console.log('自定义点击回调', value)
            },
            onClick (key, value, index) {
                alert('点击回调' + index)
                console.log('点击回调', key, value, index)
            }
        }
    },
    components: {
        vcDropdown
    }
})
<vc-dropdown
    v-if="useSlot"
    :label="label"
    :open="open"
>
    <a class="dropdown-toggle dropdown-trigger" data-dropdown-trigger="vc-dropdown">
        <span>下拉菜单自定义</span>
        <span class="caret"></span>
    </a>
    <ul slot="dropdown-menu" class="dropdown-menu">
        <li @click="customClick(1)"><a>用户手机号</a></li>
        <li @click="customClick(2)"><a>用户ID</a></li>
    </ul>
</vc-dropdown>
<vc-dropdown
    v-if="!useSlot"
    :label="label"
    :open="open"
    :on-click="onClick"
></vc-dropdown>