Files
lootalot/lootalot_front/src/components/NumberInput.vue
2019-06-14 14:31:46 +02:00

29 lines
686 B
Vue

<template>
<input type="text"
class="input"
:class="{'is-danger': has_error}"
:value="value"
@input="checkError"
></input>
</template>
<script>
export default {
props: ["value"],
data () {
return { has_error: false};
},
methods: {
checkError (ev) {
const newValue = ev.target.value;
this.has_error = isNaN(newValue);
this.$emit(
'input',
// Do the conversion if valid
this.has_error ? newValue : Number(newValue)
);
}
},
}
</script>