1
0
mirror of https://gitlab.com/bramw/baserow.git synced 2024-11-22 07:42:36 +00:00
bramw_baserow/web-frontend/modules/builder/components/page/PreviewNavigationBarInput.vue

53 lines
956 B
Vue

<template>
<input
v-model="inputValue"
class="preview-navigation-bar-input"
:class="{
'preview-navigation-bar-input--invalid': invalidValueForType,
}"
/>
</template>
<script>
export default {
props: {
defaultValue: {
type: [String, Number],
required: false,
default: '',
},
validationFn: {
type: Function,
required: true,
},
},
data() {
return {
value: this.defaultValue,
invalidValueForType: false,
}
},
computed: {
inputValue: {
get() {
return this.value
},
set(inputValue) {
this.invalidValueForType = false
this.value = inputValue
try {
this.$emit('change', this.validationFn(this.value))
} catch (error) {
this.invalidValueForType = true
}
},
},
},
watch: {
defaultValue(newValue) {
this.inputValue = newValue
},
},
}
</script>