Vue2 Starter
ES6 + Vue.js jsFiddle Starter Template
by Christian Gambardella
http://gambardella.info/2016/11/03/jsfiddle-starter-for-vue-js/
HTML
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.2.3/css/bulma.min.css">
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.1.4/vue.js"></script>
<script src="https://cdn.jsdelivr.net/vee-validate/2.0.0-beta.18/vee-validate.js"></script>
<div id="app">
<form action="">
<select v-model="selected" name="fruit" v-validate data-vv-rules="required">
<option value="">Pls pick a fruit</option>
<option value="Apple">Apple</option>
<option value="Banana">Banana</option>
</select>
<div class="error" v-show="errors.has('fruit')">
Please select a fruit.
</div>
<div id="output">
Selected: {{selected}}
</div>
</form>
</div>
SCSS
.error {
color: red;
}
#output {
margin-top: 10px;
}
Babel + JSX
Vue.use(VeeValidate)
new Vue({
data () {
return {
selected: ''
}
}
}).$mount('#app')