Vuejs-在当前页面中POST请求后获取对象ID

Question

我想在同一页面实现保存和编辑。当然，我有很多字段输入所以，我可以输入一些输入字段和save没有重定向到另一个页面。

我想要的是在 POST 请求后获取当前 ID 所以，我可以使用 That ID 到 PATCH request。

Vuejs Code

<v-btn
    color="primary"
    v-if="isEdit === false"
    small
    :loading="loading"
    @click="save"
    >save</v-btn
>
<v-btn
    color="primary"
    small
    :loading="loading"
    @click="edit"
    v-if="isEdit === true"
    >edit</v-btn
>

In script

<script>
export default {
   data() {
        return {
          form: {},
          isEdit: false
       }
   },

     save() {
            this.loading = true;
            axios
                .post(`api/v1/partner/`, this.form)
                .then((res) => {
                    console.log(res);
                    this.isEdit = true;
                })
                .catch((err) => {
                    console.log(err.response);
                    this.loading = 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) => {
                    console.log(res);
                    // this.$router.push(`/partner/`);
                    this.loading = false;
                })
                .catch((err) => {
                    console.log(err.response);
                    this.loading = false;
                });
        },
}
</script>

感谢您的所有帮助。谢谢...

Answer 1

假设您的 API 使用新 ID 从 POST 请求响应，您只需将其设置为您的 form 对象

axios.post("api/v1/partner/", this.form)
  .then(res => {
    console.log(res)
    this.isEdit = true
    this.form.id = res.data.id // assuming that's the right property name
  })