vue-sticky-select

    1.0.1 • Public • Published

    vue-sticky-select

    showcase

    Select component for VueJS, inspired by macOS native select UI element.

    Install

    npm i vue-sticky-select

    Usage

    Select with prefix icons

    <sticky-select
      :options="options"
      v-model="selectedOptionIndex"
      placeholder="Select option"
    />
    import StickySelect from "vue-sticky-select";
     
    export default {
      name: "FooBar",
      components: {
        StickySelect,
      },
      data: () => ({
        selectedOptionIndex: null,
        options: [
          {
            prefix: () => import("@/SomeIcon"),
            text: "Banana",
          },
          {
            prefix: () => import("@/SomeIcon"),
            text: "Avocado",
          },
          {
            prefix: () => import("@/SomeIcon"),
            text: "Durian",
          },
        ],
      }),
    };

    Select with plain strings

    <sticky-select
      :options="options"
      v-model="selectedOptionIndex"
      placeholder="Select option"
    />
    import StickySelect from "vue-sticky-select";
     
    export default {
      name: "FooBar",
      components: {
        StickySelect,
      },
      data: () => ({
        selectedOptionIndex: null,
        options: ["Banana", "Avocado", "Durian"],
      }),
    };

    Props

    Prop Type Required Default Description
    options Array true [] List of options
    selected Number false null Selected option index number
    placeholder String false "" Placeholder text when no selected index is provided
    disabled Boolean false false Disable select
    base-class String false "sticky-select" Base CSS class

    Events

    Name Arguments Description
    change index On newly selected option
    open None On options opened
    close None On options closed

    Install

    npm i vue-sticky-select

    DownloadsWeekly Downloads

    1

    Version

    1.0.1

    License

    MIT

    Unpacked Size

    93.6 kB

    Total Files

    7

    Last publish

    Collaborators

    • liutkin