vue.js - 如何将旧值提取到输入字段中以更新 laravel vue.js 中的数据

Question

我是初学者。在我的 laravel vue 应用程序中，我想更新数据。但在更新之前，我想将现有值提取到归档中。我尝试了多种方法，例如 v-model ，三元运算符，但不幸的是未能做到这一点。我相信我应用了错误的逻辑。请帮帮我

代码

Vue 模板

          <template>

             <!-- ======== Event Start  ======== -->
                                    <div
                                      class="form-group row without-form-background mb2"
                                    >
                                      <label class="col-md-2 label-control" for="name"
                                        >Event</label
                                      >
                                      <div class="col-md-10">
                                        <select name="" id="" class="form-control">
                                          <option
                                            v-for="event in event"
                                            :key="event.id"
                                            :value="event.name"
                                          >
                                            {{ event.name }}
                                          </option>
                                        </select>
                                      </div>
                                    </div>

                                    <!-- ======== Event Ends  ======== -->

                                    <!-- ////////////////////// -->

                                    <!-- ======== Category Start  ======== -->

                                    <div
                                      class="form-group row without-form-background mb2"
                                    >
                                      <label class="col-md-2 label-control" for="name"
                                        >Category</label
                                      >
                                      <div class="col-md-10">
                                        <select
                                          name="category[]"
                                          id=""
                                          class="form-control multiselect"
                                          multiple="multiple"
                                          tabindex="-1"
                                        >
                                          <option
                                            v-for="cate in categoryarr"
                                            :key="cate.id"
                                            :value="cate.title"
                                          >
                                            {{ cate.title }}
                                          </option>
                                        </select>
                                      </div>
                                    </div>
                                    </template>

<script>
export default {
  data() {
    return {
      data: "",
      event: [],
      categoryarr: [],
    };
  },
  mounted() {
    // Get the Data from DB to edit

    const last_segment = window.location.pathname.split("/").pop();
    axios
      .get("/admin/merchandise/catalog/product/edit-data/" + last_segment)

      .then((response) => {
        
        let res = response.data;
        (this.data = res.data[0]),
          (this.event = res.event),
          (this.categoryarr = res.categoryarr[0])
      });
  },
};
</script>