JSFiddle - React, Tailwind, and code Playground
by Nightythehawk
HTML
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/vue.js"></script>
<script src="https://unpkg.com/[email protected]/dist/polyfill.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/bootstrap-vue.js"></script>
<template>
<div>
<b-form-select v-model="selected" :options="options" class="mb-3" />
<b-form-select v-model="selected" :options="options" class="mb-3" size="sm" />
<div>Selected: <strong>{{ selected }}</strong></div>
</div>
</template>
<script>
</script>
Vue
export default {
data () {
return {
selected: null,
options: [
{ value: null, text: 'Please select an option' },
{ value: 'a', text: 'This is First option' },
{ value: 'b', text: 'Selected Option' },
{ value: {'C': '3PO'}, text: 'This is an option with object value' },
{ value: 'd', text: 'This one is disabled', disabled: true }
]
}
}
}