Question

首先，很抱歉我的英语不好，并且这个主题已经开放。

在VueJS：2.6.11中使用Vuetify，当我使用v对话框时，我丢失了数据表中的单击项。

我正在使用带有一些自定义操作的v-data-table：

当我单击绿色的btn时，会出现一个对话框，其中包含2个btn（否/是）。

看：

<template v-slot:item.actions="{ item }">
              <!-- Bouton Duplication -->
              <v-dialog
                v-model="dialogDuplication"
                persistent
                max-width="450"
                :retain-focus="false"
              >
                <template v-slot:activator="{ on: dialogDuplication, attrs }">
                  <v-tooltip bottom>
                    <template v-slot:activator="{ on: tooltip }">
                      <v-btn
                        small
                        class="px-2 ml-1"
                        min-width="0"
                        color="success"
                        v-bind="attrs"
                        v-on="{ ...dialogDuplication, ...tooltip }"
                      >
                        <v-icon>mdi-plus-circle-multiple-outline</v-icon>
                      </v-btn>
                    </template>
                    <span>Dupliquer l'évènement</span>
                  </v-tooltip>
                </template>
                <v-card>
                  <v-card-text>Êtes-vous sûr de vouloir dupliquer cet évènement ?</v-card-text>
                  <v-card-actions>
                    <v-spacer />
                    <v-btn
                      class="mr-3"
                      text
                      @click="dialogDuplication = false"
                    >
                      Annuler
                    </v-btn>
                    <v-btn
                      color="success"
                      text
                      @click="dialogDuplication = false; duplicateEvent(item)"
                    >
                      Oui
                    </v-btn>
                  </v-card-actions>
                </v-card>
              </v-dialog>

...

当调用方法“ duplicateEvent”时，我无法访问正确的“ item”值。通常，我会有单击的项目，但列表中有最后显示的项目。

最后，对于列表中的另一个按钮，我不使用对话框，它与我的ModifyEvent（item）方法²一起使用！

<v-tooltip bottom>
                    <template v-slot:activator="{ on, attrs }">
                      <v-btn
                        small
                        class="px-2 ml-1"
                        min-width="0"
                        color="primary"
                        v-bind="attrs"
                        v-on="on"
                        @click.native="modifyEvent(item)"
                      >
                        <v-icon>mdi-pencil-outline</v-icon>
                      </v-btn>
                    </template>
                    <span>Modifier l'évènement</span>
                  </v-tooltip>

怎么可能？

感谢所有人

：）

Vuetify表-对话框中单击的项目值丢失

0 个答案: