'Vuetify v-edit-dialog to change data table values async
I decided to use the data table with edit dialog from Vuetify.
I managed to customize it to my own structure and data. However, on save I want to make a post request to the back-end and update the value in the table only after I receive a success. Instead, the default functionality is somehow syncing the value in the dialog input with the one in the table, which is something I don't want. I know it has to do something with this :return-value.sync but I don't know how should I modify it in order to update the value only when I want to, or at least how to turn it back to the previous value if an error occurs. I already did the sending of the correct data in the post request, I'm not asking about it.
<template v-slot:item.title="props">
<v-edit-dialog
:return-value.sync="props.item.title"
@save="save(props.item)"
@cancel="cancel"
@open="open"
@close="close"
>
{{ props.item.title }}
<template v-slot:input>
<v-text-field
v-model="props.item.title"
:rules="[max25chars]"
label="Edit"
single-line
counter
></v-text-field>
</template>
</v-edit-dialog>
</template>
Any help would be appreciated.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|
