An example would be to have an input and when a condition is met show the vs-alert
the value is invalid you can only enter numbers
<template>
<vs-input label="Enter only numbers" placeholder="0123456789" v-model="value1" class="my-4" />
<vs-alert :active="inputValid" color="danger" icon-pack="feather" icon="icon-info">
<span>the value is <b>invalid</b> you can only enter numbers</span>
</vs-alert>
</template>
<script>
export default {
data() {
return {
value1: '',
}
},
computed: {
inputValid() {
if (/^\d+$/.test(this.value1)) {
return false
} else {
return true
}
}
}
}
</script>