我想用axios在vue.js中使用复选框更新多行。一切都很好，但它不起作用。
当我点击复选框并点击按钮时，打开一张卡片。当我输入"writerid"时，我想更新选中的行

<v-card
      v-if="showCard"
      max-width="400"
      class="mx-auto"  
    >
      <v-container>
        <v-row dense>
          <v-col cols="12">
            <v-card
              color="#385F73"
              theme="dark"
            >
         
              <v-card-title class="text-h6">
                Lütfen güncelenecek yazar id giriniz.
              </v-card-title>
  
              <v-card-subtitle>
                <input v-model="writerId" type="text" class="textbox2"/>
              </v-card-subtitle>
  
              <v-card-actions>
                <v-btn
                    class="ml-2"
                    variant="outlined"
                    size="small"
                    @click="updateBooks()"
                  >
                    Güncelle
                  </v-btn>
              </v-card-actions>
            

            </v-card>
          </v-col>
        </v-row>
      </v-container>

    </v-card>

async updateBooks() {
      if(this.singleSelect.length !== 0) {
        for(var i = 0; i < this.singleSelect.length; i++) {
          try {
        const result = await axios.put(
          `https://localhost:7258/api/Book/` + this.books[i]["bookId"],
          {
            writerId: this.writerId
          }
        );

        console.log(result.data);
        // alert("Kitap bilgileri başarıyla güncellendi!");
        this.$root.SnackbarPage.show({ text: "Kitap başarıyla güncellendi!" });
        // this.reloadPage();
      } catch (e) {
        console.log(e);
      }