extern/2FAuth
1
0
Fork 0
mirror of https://github.com/Bubka/2FAuth.git synced 2025-06-20 11:47:53 +02:00
Code Issues Packages Projects Releases Wiki Activity

Fix FormCheckBox model binding and event emitting

Browse Source
This commit is contained in:
Bubka 2023-10-05 14:00:30 +02:00
parent 7efc20e74f
commit 48f5c41288
1 changed files with 13 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
resources/js_vue3/components/formElements/FormCheckbox.vue
View File

@ -26,19 +26,26 @@
const emit = defineEmits(['update:modelValue']) const emit = defineEmits(['update:modelValue'])
const attrs = useAttrs() const attrs = useAttrs()
const checked = ref(props.modelValue) const model = computed({
get() {
return props.modelValue;
},
set(value) {
emit("update:modelValue", value);
},
})
function setCheckbox() { function toggleModel() {
if (attrs['disabled'] == undefined) { if (attrs['disabled'] != true) {
emit('update:modelValue', checked) model.value = !model.value
} }
} }
</script> </script>
<template> <template>
<div class="field"> <div class="field">
<input :id="fieldName" type="checkbox" :name="fieldName" class="is-checkradio is-info" v-model="checked" v-on:change="setCheckbox" v-bind="$attrs"/> <input :id="fieldName" type="checkbox" :name="fieldName" class="is-checkradio is-info" v-model="model" v-bind="$attrs"/>
<label tabindex="0" :for="fieldName" class="label" :class="labelClass" v-html="$t(label)" v-on:keypress.space.prevent="setCheckbox" /> <label tabindex="0" :for="fieldName" class="label" :class="labelClass" v-html="$t(label)" v-on:keypress.space.prevent="toggleModel" />
<p class="help" v-html="$t(help)" v-if="help" /> <p class="help" v-html="$t(help)" v-if="help" />
</div> </div>
</template> </template>