My Vue component is a text editor from a 3rd party package, requiring a value to render correctly.
<SomeComponent v-model:value="text" />
<script setup>
const props = {
records: {
type: Object,
},
}
const text = computed(() => props.records.first())
</script>
I need to update my database whenever the text property changes.
watch(text, () => {
//Post to database...
})
To prevent database updates on every keystroke, I attempted to make the v-model lazy like this:
<SomeComponent v-model:value.lazy="text" />
Unfortunately, this method did not work, as the code inside my watch method is triggered with each keystroke.