tb-vue3-typeahead

1.0.1 • Public • Published

Install:

npm i tb-vue3-typeahead

Example:

<template>
    <Typeahead
        :data='data'
        :inputStyle="{
                backgroundColor: 'white',
                width: '460px',
                height: '35px',
                border: 'solid 1px black',
                fontSize: '20px'
            }"
        placeholder="Search..."
        @tb-typeahead-result="TbTypeaheadResult"
    >
    </Typeahead>
</template>

<script>

    import Typeahead from 'tb-vue3-typeahead';

    import { ref } from 'vue';

    export default {
        components: {
            Typeahead
        },
        setup() {

            const data = ref([
                'Avon',
                'Bedfordshire',
                'Berkshire',
                'Buckinghamshire',
                'Cambridgeshire',
                'Cheshire',
                'City of London',
                'Cleveland',
                'Cornwall',
                'Cumbria',
                'Derbyshire',
                'Devon',
                'Dorset',
                'Durham',
                'East Sussex',
                'Essex',
                'Gloucestershire',
                'Greater London',
                'Greater Manchester',
                'Hampshire',
                'Herefordshire',
                'Hertfordshire',
                'Isle of Wight',
                'Kent',
                'Lancashire',
                'Leicestershire',
                'Lincolnshire',
                'Merseyside',
                'Middlesex',
                'Norfolk',
                'Northamptonshire',
                'Northumberland',
                'North Humberside',
                'North Yorkshire',
                'Nottinghamshire',
                'Oxfordshire',
                'Rutland',
                'Shropshire',
                'Somerset',
                'South Humberside',
                'South Yorkshire',
                'Staffordshire',
                'Suffolk',
                'Surrey',
                'Tyne and Wear',
                'Warwickshire',
                'West Midlands',
                'West Sussex',
                'West Yorkshire',
                'Wiltshire',
                'Worcestershire'
            ]);

            function TbTypeaheadResult(result) {
                console.log(result)
            }
            return { data, TbTypeaheadResult}

        }
    }
</script>

Props:

   inputStyle: Style The Input Field
   
   ulStyle: Style The ul Tag For Results
   
   liStyle: Style The li Tags For Results

Readme

Keywords

Package Sidebar

Install

npm i tb-vue3-typeahead

Weekly Downloads

3

Version

1.0.1

License

MIT

Unpacked Size

16.8 kB

Total Files

6

Last publish

Collaborators

  • tuckbloor