maxLength относится только к типам текста, я попытался выполнить тест, чтобы увидеть, поддерживаются ли min и max, и, кажется, так, пожалуйста, посмотрите:
new Vue({
el: '#app',
methods: {
onSubmit(evt) {
evt.preventDefault()
console.log(evt)
}
}
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<script src="https://unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.min.js"></script>
<div id="app">
<b-form @submit="onSubmit">
<b-form-input type="number" max="20" min="10"><min="10" required></b-form-input>
<b-button type="submit" variant="primary">Submit</b-button>
</b-form>
</div>
Имейте в виду, что проверка мин и макс выполняется при отправке формы, с обязательным параметром курса.
РЕДАКТИРОВАТЬ : добавлена форма и отправлено во фрагмент
РЕДАКТИРОВАТЬ 2: без формы отправить
new Vue({
el: '#app',
methods: {
onSubmit(evt) {
evt.preventDefault()
console.log(evt)
}
},
data() {
return{
inputValue: 15
}
},
watch: {
inputValue(val){
if(val < 10)
this.inputValue = 10;
else if(val > 20)
this.inputValue = 20;
}
}
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.17/vue.js"></script>
<script src="https://unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.min.js"></script>
<div id="app">
<b-form-input v-model="inputValue" type="number" max="20" min="10" required></b-form-input>
</div>