Answer the question
In order to leave comments, you need to log in
How to properly edit a form in vue without an extra request to the server?
Good day. Again with a basic question (I’m already starting to boil. I’m doing
the simplest operation - editing the form. There is a table. I press edit. The form opens. And then two-way communication works. And everything that I write in the form fields is immediately displayed in the table.
.
Each time what - something adventures (then when editing, Avoid mutating a prop directly swears.
Now, on the contrary, it edits everything.
No, I can, of course, get data from the server with one more request, but here it’s a matter of principle that I’m doing it wrong in a hurry.
<edit-form :city="city" v-if="editing"> </edit-form>
editRow(rowData) {
this.editing=true;
this.city = this.cities.find(item => item.id == rowData.id);
this.$store.commit('EDIT_ITEM',this.city)
and in the form of computeditem() {
return this.$store.getters.currentItem
},
<template>
<div class="w-1/2">
<form action="" ref="formData" @submit.prevent>
<label for="">Название города</label>
<input type="text" v-model="city.name">
<label for="">Английский вариант</label>
<input type="text" v-model="city.engname">
<button @click.prevent="saveData">Сохранить</button>
</form>
</div>
</template>
<script>
export default {
props:['city'],
data() {
return {
upd:{}
}
},
methods: {
saveData() {
console.log(this.item)
this.$store.commit("CLEAR_ITEM")
}
},
computed: {
item() {
return this.$store.getters.currentItem
},
},
mounted() {
this.upd = this.$store.getters.currentItem
console.log(this.upd)
}
}
</script>
Answer the question
In order to leave comments, you need to log in
And what for to you this.upd
if except assignment you do not use it anywhere?
And then there is a two-way connection. and everything that I write in the form fields is immediately displayed in the table
this.city
and edit in the form of a copy.
Didn't find what you were looking for?
Ask your questionAsk a Question
731 491 924 answers to any question