ami/tl-vikunja
1
0
Fork 0
Code

feat: move config preparation in separate function

Browse Source
This commit is contained in:
Dominik Pschenitschni 2022-10-24 16:40:57 +02:00 committed by kolaente
parent 52d4d0bdb9
commit e74e6fcc99
No known key found for this signature in database
GPG Key ID: F40E70337AB24C9B
1 changed files with 17 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

28
src/components/misc/flatpickr/Flatpickr.vue
View File

@ -84,7 +84,7 @@ const props = defineProps({
// ); // );
// } // }
}, },
// https://chmln.github.io/flatpickr/options/ // https://flatpickr.js.org/options/
config: { config: {
type: Object as PropType<Options>, type: Object as PropType<Options>,
default: () => ({ default: () => ({
@ -117,17 +117,10 @@ const root = ref<HTMLInputElement | null>(null)
const fp = ref<Flatpickr.Instance | null>(null) const fp = ref<Flatpickr.Instance | null>(null)
const safeConfig = ref<Options>(cloneObject(props.config)) const safeConfig = ref<Options>(cloneObject(props.config))
onMounted(() => { function prepareConfig() {
// Don't mutate original object on parent component // Don't mutate original object on parent component
const newConfig = cloneObject(props.config) const newConfig = cloneObject(props.config)
if (
fp.value || // Return early if flatpickr is already loaded
!root.value // our input needs to be mounted
) {
return
}
props.events.forEach((hook) => { props.events.forEach((hook) => {
// Respect global callbacks registered via setDefault() method // Respect global callbacks registered via setDefault() method
const globalCallbacks = Flatpickr.defaultConfig[hook] || [] const globalCallbacks = Flatpickr.defaultConfig[hook] || []
@ -155,6 +148,19 @@ onMounted(() => {
safeConfig.value = newConfig safeConfig.value = newConfig
return safeConfig.value
}
onMounted(() => {
if (
fp.value || // Return early if flatpickr is already loaded
!root.value // our input needs to be mounted
) {
return
}
prepareConfig()
/** /**
* Get the HTML node where flatpickr to be attached * Get the HTML node where flatpickr to be attached
* Bind on parent element if wrap is true * Bind on parent element if wrap is true
@ -225,8 +231,8 @@ watch(
newValue => { newValue => {
// Prevent updates if v-model value is same as input's current value // Prevent updates if v-model value is same as input's current value
if (!root.value || newValue === nullify(root.value.value)) return if (!root.value || newValue === nullify(root.value.value)) return
// Make sure we have a flatpickr instanceand // Make sure we have a flatpickr instance and
// Notify flatpickr instance that there is a change in value // notify flatpickr instance that there is a change in value
fp.value?.setDate(newValue, true) fp.value?.setDate(newValue, true)
}, },
{deep: true}, {deep: true},