V-edit-开始键入时直接关闭对话框

Question

这是一支笔：https://codepen.io/wbuc/pen/eYNyXGa

我正在使用数据表中的v- edit -对话框编辑单元格内联，但当我开始在打开的对话框中键入时，它在第一次按键后立即关闭。这里我漏掉了什么？

感谢您的帮助！

<v-data-table
          v-model="selected"
          :headers="headers"
          :items="accounts"
          :single-select="singleSelect"
          item-key="email"
          show-select
          class="elevation-3"
     >
          <template v-slot:item.email="props">
               <v-edit-dialog
                    :return-value.sync="props.item.email"
                    @save="save"
                    @cancel="cancel"
                    @open="open"
                    @close="close"
               >
                    {{ props.item.email }}
                    <template v-slot:input>
                         <v-text-field v-model="props.item.email" label="Edit" single-line counter></v-text-field>
                    </template>
               </v-edit-dialog>
          </template>
     </v-data-table>

Answer 1

我自己解决了这个问题。

<v-data-table
          .....
          item-key="email"      <!--Delete this or item-key="id"-->

我们不能设置密钥，并在v-text-field上使用它