Saya memiliki bidang teks yang dibangun langsung ke panel ekspansi vuetify.

SS

Setelah mengklik ikon "ganti nama kotak"

Editable

Masalahnya adalah setiap kali saya mengetik spasi ke dalam kotak teks, panel ekspansi mati. Saya telah mencegah penyebaran acara klik dengan menggunakan atribut click.stop="" tetapi sepertinya saya tidak dapat mencegah acara bilah spasi ini memengaruhi induknya.

Atribut yang saya uji adalah:

  1. keydown.stop
  2. keydown.prevent ('Tidak dapat mengetik dengan opsi ini')
  3. keydown.self
  4. keydown.capture
  5. masukan.berhenti
  6. ubah.berhenti

Berikut ini adalah event-event yang dipancarkan menurut plugin vueue

enter image description here

Ini kodenya

<v-expansion-panel
active
v-for="(item, i) in $store.state.data"
:key="i"
>
<v-expansion-panel-header>
  <div v-if="editorQ !== i">Q. {{ item.q }}</div>
  <v-text-field
    v-else
    label="Question"
    :value="newQuestion"
    @click.stop=""
    @change.stop="updateQ"
    @keydown.stop=""
  ></v-text-field>
  <template v-slot:actions>
    <v-btn
      v-if="editorQ === i"
      @click.stop="doneEditingQuestion(i)"
      depressed
      icon
      text
    >
      <v-icon> mdi-check </v-icon>
    </v-btn>
    <v-btn
      class="upright"
      v-else
      @click.stop="editQuestion(i)"
      depressed
      icon
      text
    >
      <v-icon> mdi-rename-box </v-icon>
    </v-btn>
  </template>
</v-expansion-panel-header>
<v-expansion-panel-content>

0
Moiz Sohail 12 Mei 2021, 12:49

1 menjawab

Jawaban Terbaik

Itu hanya coba-coba bagi saya, berikut ini mencegah sakelar active:

@click.stop
@keyup.prevent

Ketika diterapkan ke v-text-field dalam v-expansion-panel-header.

pena kode

1
Ohgodwhy 12 Mei 2021, 10:24