Как правильно редактировать форму в vue без лишнего запроса на сервер?

Доброго дня. Снова с базовым вопросом( уже закипать начинаю.

Делаю простейшую операцию - редактирование формы. Есть таблица. Жму edit. Открывается форма. А дальше срабатывает двусторонняя связь. и все, что я пишу в полях формы - сразу отображается в таблице.
.
Каждый раз какие-то приключения( то при редактировании ругается Avoid mutating a prop directly.
Теперь, наоборот, все подряд редактирует.

Нет, я могу конечно еще одним запросом получить данные с сервера, но тут вопрос принципа, что я не так в спешке делаю.

<edit-form :city="city" v-if="editing"> </edit-form>

editRow(rowData) {
this.editing=true;
this.city = this.cities.find(item => item.id == rowData.id);

я уже и через vuex делал
this.$store.commit('EDIT_ITEM',this.city) и в форме computed
item() {
      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>


Сколько делал - впервые с такой ерундой столкнулся. Просто в этот раз нужно реализовать без лишнего запроса на сервер. Что-то я на простейшем застрял(
  • Вопрос задан
  • 125 просмотров
Пригласить эксперта
Ответы на вопрос 1
yarkov
@yarkov Куратор тега Vue.js
Проект "Жизнь после смерти" - lifeafterdeath.ru
А зачем Вам this.upd, если кроме присваивания Вы его не используете нигде?
А дальше срабатывает двусторонняя связь. и все, что я пишу в полях формы - сразу отображается в таблице

Ну так копируйте this.city и редактируйте в форме копию.
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
PLATFORM Тюмень
от 100 000 до 150 000 ₽
ДП-Экспресс Санкт-Петербург
от 130 000 до 200 000 ₽
Astroshock Москва
от 110 000 до 180 000 ₽
21 янв. 2021, в 14:45
3000 руб./за проект
21 янв. 2021, в 14:41
8000 руб./за проект