fix: use vue3 v-model bindings

see: https://v3.vuejs.org/guide/migration/v-model.html
This commit is contained in:
Dominik Pschenitschni 2021-08-23 21:18:12 +02:00
parent 2ef2bb7700
commit 51a740f53c
No known key found for this signature in database
GPG key ID: B257AC0149F43A77
29 changed files with 114 additions and 96 deletions

View file

@ -83,14 +83,6 @@
<script>
import {closeWhenClickedOutside} from '@/helpers/closeWhenClickedOutside'
/**
* Available events:
* @search: Triggered every time the search query input changes
* @select: Triggered every time an option from the search results is selected. Also triggers a change in v-model.
* @create: If nothing or no exact match was found and `creatable` is true, this event is triggered with the current value of the search query.
* @remove: If `multiple` is enabled, this will be fired every time an item is removed from the array of selected items.
*/
export default {
name: 'multiselect',
data() {
@ -133,7 +125,7 @@ export default {
},
},
// The object with the value, updated every time an entry is selected.
value: {
modelValue: {
default() {
return null
},
@ -188,6 +180,16 @@ export default {
},
},
},
/**
* Available events:
* @search: Triggered every time the search query input changes
* @select: Triggered every time an option from the search results is selected. Also triggers a change in v-model.
* @create: If nothing or no exact match was found and `creatable` is true, this event is triggered with the current value of the search query.
* @remove: If `multiple` is enabled, this will be fired every time an item is removed from the array of selected items.
*/
emits: ['update:modelValue', 'search', 'select', 'create', 'remove'],
mounted() {
document.addEventListener('click', this.hideSearchResultsHandler)
},
@ -195,7 +197,7 @@ export default {
document.removeEventListener('click', this.hideSearchResultsHandler)
},
watch: {
value: {
modelValue: {
handler(value) {
this.setSelectedObject(value)
},
@ -278,7 +280,7 @@ export default {
this.internalValue = object
}
this.$emit('input', this.internalValue)
this.$emit('update:modelValue', this.internalValue)
this.$emit('select', object)
this.setSelectedObject(object)
this.closeSearchResults()
@ -352,7 +354,7 @@ export default {
}
}
this.$emit('input', this.internalValue)
this.$emit('update:modelValue', this.internalValue)
this.$emit('remove', item)
},
focus() {