Vue
HTML
<script type="text/x-template" id="question">
<select v-if="type == 'select'">
<option v-for="item in items" value="item.value">{{ item.text }}</option>
</select>
<select v-else-if="type == 'multiple'" multiple>
<option v-for="item in items" value="item.value">{{ item.text }}</option>
</select>
<input v-else-if="type == 'image'" type="file" id="image" name="image" accept="image/png, image/jpeg">
</script>
<div id="app">
<question type='image'></question>
</div>
Vue
Vue.component('question', {
template: '#question',
props: {
type: {
default: ''
},
items: {
type: Array,
default: [
{ value: 1, text: 'One' },
{ value: 2, text: 'Two' },
{ value: 3, text: 'Three' }
]
}
}
});
new Vue({
el: '#app',
components: ['question']
});