wmselect-new v0.1.0

WMSelect

Custom select for Vue.js (2+ версии) framework

Install

npm i wmselect-new

Dependencies

• Vue 2*/3

Demo

https://gitlab.wmstudio.su/strangetin/vue-test-project

Usage

Options can be passed as props

<WMSelect
        v-model="selected"
        :list="list"
        label-from="name"
/>

And you can change this view as you want

<WMSelect v-model="selected" :list="list" label-from="name">

    <template v-slot:list="{ item }">{{ item }}</template>

</WMSelect>

It can support some items before and after content

<WMSelect v-model="selected" :list="list" label-from="name">

    <template v-slot:beforeItem="{ item }">{{ item }}</template>
    <template v-slot:list="{ item }">{{ item }}</template>
    <template v-slot:afterItem="{ item }">{{ item }}</template>

</WMSelect>

import WMSelect from "@/components/WMSelect";

export default {
    name: "App",
    data() {
        return {
            list: [
                {name: "Alex", age: 25},
                {name: "Melman", age: 22},
                {name: "Glory", age: 10},
                {name: "Marty", age: 10},
            ],
            selected: {
                name: "Выберите пользователя",
                age: 30,
            },
        };
    },
    components: {
        WMSelect,
    },
};