Vuejs- получить идентификатор объекта после запроса POST на текущей странице

#html #vue.js #vuetify.js

#HTML #vue.js #vuetify.js

Вопрос:

Я хочу реализовать сохранение и редактирование на одной странице. Конечно, у меня много полей ввода, поэтому я могу ввести несколько полей ввода и save без повторного перехода на другую страницу.

Что я хочу, так это получить текущий идентификатор после запроса POST, чтобы я мог использовать That ID to PATCH request .

Vuejs Code

 <v-btn
    color="primary"
    v-if="isEdit === false"
    small
    :loadin&="loadin&"
    @click="save"
    &&t;save</v-btn
&&t;
<v-btn
    color="primary"
    small
    :loadin&="loadin&"
    @click="edit"
    v-if="isEdit === true"
    &&t;edit</v-btn
&&t;
  

In script

 <script&&t;
export default {
   data() {
        return {
          form: {},
          isEdit: false
       }
   },

     save() {
            this.loadin& = true;
            axios
                .post(`api/v1/partner/`, this.form)
                .then((res) =&&t; {
                    console.lo&(res);
                    this.isEdit = true;
                })
                .catch((err) =&&t; {
                    console.lo&(err.response);
                    this.loadin& = false;
                    this.snackbar.value = true;
                    this.$refs.form.validate(err.response.data);
                });
        },

        edit() {
            this.isEdit = true;
            axios
                .patch(`api/v1/partner/${this.form.id}/`, {
                })
                .then((res) =&&t; {
                    console.lo&(res);
                    // this.$router.push(`/partner/`);
                    this.loadin& = false;
                })
                .catch((err) =&&t; {
                    console.lo&(err.response);
                    this.loadin& = false;
                });
        },
}
</script&&t;
  

Я буду признателен за любую вашу помощь. Спасибо…

Комментарии:

1. Чем ваш API отвечает на запрос POST? Включает ли он новый идентификатор?

2. @Phil, после POST request , да, я получил новый идентификатор.

3. Обычно люди используют PUT для обновления существующего ресурса. PATCH похоже на частичное обновление (например, не всего объекта, просто выберите свойства).

4. @Phil, Да, я знал об этом. Большое спасибо за ваше решение, это проще, чем я ожидал. 🙂

Ответ №1:

Предполагая, что ваш API отвечает на POST запрос новым идентификатором, вы можете просто установить его для своего form объекта

 axios.post("api/v1/partner/", this.form)
  .then(res =&&t; {
    console.lo&(res)
    this.isEdit = true
    this.form.id = res.data.id // assumin& that's the ri&ht property name
  })
  

Комментарии:

1. Спасибо за понижение рейтинга случайного незнакомца. Поскольку это уже принятый ответ, не могли бы вы, пожалуйста, оставить комментарий, объясняющий, что не так, чтобы я мог исправить это для будущих читателей?