0
As it mentioned in Vue.JS docs you can use v-bind:class
to achieve what you wanted:
<select v-model="value.from" v-bind:class="{required: isRequired}">
which required
is data, computed field in your app/component.
Update 1:
new Vue({
el: "#myApp",
data: {
// you should define a variable in your data
isRequired: false
},
methods: {
doSomething: function(){
this.isRequired = true;
}
}
});
- [Vuejs]-How to configure the first 3 values in v-for
- [Vuejs]-Computed variable doesn't invoke set() method. Using v-model in v-for for computed variable
0
The required attribute is a boolean (an not a class). You don’t need to give it a value; if it is present in the select tag, the select is required.
You can also bind it to a boolean value to change whether the select is required.
new Vue({
el: '#app',
data: {
isRequired: false
}
});
[required] {
outline: thin solid red;
}
<script src="//unpkg.com/vue@latest/dist/vue.js"></script>
<div id="app">
<select required>
<option>An option</option>
</select> This one is always required
<div>
<select :required="isRequired">
<option>Whatever</option>
</select>
<input type="checkbox" v-model="isRequired"> Is Required: {{isRequired}}
</div>
</div>
Source:stackexchange.com