Vue2Examples

Vue2Examples Component for Vue 2.x

Install

    npm install vue2-examples --save

Demo

For demo, please see here

Usage

1. Import the component

import Vue2Examples from 'vue2-examples';

2.1 Use it globally

Vue.use(Vue2Examples);

2.2 Or use it locally

components: {
    'vue2-examples': Vue2Examples
},

3. Update your app or template:

<div>
...
<vue2-examples></vue2-examples>
...
</div>

Properties

• examples: Array

• divider: String (default: *, *)

• tag: String (default: small)

• label: String (default: Examples:)

• labelClass: String (default: text-info)

• exampleClass: String (default: text-muted)

• value: any

Example

<template>
    <div>
        <div class="card card-body">
            <vue2-examples v-model="data" :examples="['one', 'two', 'three', 'four']"></vue2-examples>
            <hr>
            <vue2-examples v-model="data" :examples="[{label: 1, value: '1st'}, {label: 2, value: '2nd'}, {label: 3, value: '3rd'}, ]"></vue2-examples>
        </div>

        <div class="card card-body">
            <pre>Data: {{data}}</pre>
        </div>
    </div>
</template>

<script>
    import Vue2Examples from '../src/index';

    export default {
        name: 'app',
        data() {
            return {
                data: ''
            }
        },
        components: {
            Vue2Examples
        },
        methods: {},
    }
</script>

Contributing

Contributions are welcome

Build Setup

# install dependencies
npm install

# serve with hot reload at localhost:8080
npm run dev

# build for production with minification
npm run build