Vue.js multiple update-CodePudding

I want to update multiple rows using the checkbox, in vue.js, with axios. Everything is okay, but it's not worked.

When I click the checkbox and click the button, opens a card. When i input "writerid", I want to update checked rows

<v-card
      v-if="showCard"
      max-width="400"
        
    >
      <v-container>
        <v-row dense>
          <v-col cols="12">
            <v-card
              color="#385F73"
              theme="dark"
            >
         
              <v-card-title >
                Lütfen güncelenecek yazar id giriniz.
              </v-card-title>
  
              <v-card-subtitle>
                <input v-model="writerId" type="text" />
              </v-card-subtitle>
  
              <v-card-actions>
                <v-btn
                    
                    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);
      }

CodePudding user response：

You have to give all props which requested for update method. You should change name of input text for new update.