Wie kann die Suchkomponente von mint-ui die Suchschaltfläche auf der Tastatur anzeigen?

Was ich Ihnen dieses Mal zeige, ist, wie die Suchkomponente von mint-ui die Suchtaste auf der Tastatur anzeigen kann. Dieser Artikel gibt Ihnen eine detaillierte Analyse.

<form action="" target="frameFile">
 <mt-search v-model="value" placeholder="请输入关键字" @keyup.native.enter="search(value)">
 <p v-infinite-scroll="loadMore()" infinite-scroll-disabled="loading" infinite-scroll-distance="10">
  <ListItem :lists="lists"></ListItem>
  <p class="loading-text" v-if="(loadingTextBtn==true)"><span v-text="loadingText"></span><mt-spinner v-if="(loadingComplete==false)" type="snake" :size="10"></mt-spinner></p>
 </p>
 </mt-search>
 <iframe name=&#39;frameFile&#39; style="display: none;"></iframe>
</form>

Die Suchkomponenteneingabe von mint-ui ist standardmäßig ebenfalls vom Typ = „Suche“, muss aber auch mit einer Reihe von Formular-Tags in der äußeren Ebene und mit umschlossen werden Aktion, die auf der Tastatur angezeigt wird. Eine Suchschaltfläche wird angezeigt.

Das Obige ist Methode eins:

Wenn Sie auf der mobilen Tastatur auf „Suchen“ klicken, wird die Seite aktualisiert. Fügen Sie dem Formular also ein Ziel hinzu, und das Ziel gibt an, wo die Aktion geöffnet werden soll URL, und fügen Sie sie dann in einen versteckten Iframe ein, der den Zielwert des Formulars nennt, sodass der gesuchte Inhalt auf der aktuellen Seite angezeigt wird

<form action="" onsubmit="return false;">
  <mt-search v-model="value" placeholder="请输入关键字" @keyup.native.enter="search(value)">
   <p v-infinite-scroll="loadMore()" infinite-scroll-disabled="loading" infinite-scroll-distance="10">
   <ListItem :lists="lists"></ListItem>
   <p class="loading-text" v-if="(loadingTextBtn==true)"><span v-text="loadingText"></span><mt-spinner v-if="(loadingComplete==false)" type="snake" :size="10"></mt-spinner></p>
   </p>
  </mt-search>
</form>

Hier direkt in das onsubmit

-Ereignis Geben Sie „return false“ ein, um die Übermittlung zu deaktivieren. Die Suchlistenseite kann auch auf der aktuellen Seite angezeigt werden. Ich glaube, dass Sie die Methode beherrschen, nachdem Sie die obige Einführung gelesen haben. Weitere spannende Informationen finden Sie in anderen verwandten Artikeln auf der chinesischen PHP-Website!

Verwandte Lektüre:

So verwenden Sie JS, um gleichzeitig zwischen dem Ausblenden und Anzeigen von Symbolen zu wechseln

So unterteilen Sie Komponenten Vue.js

So verwenden Sie statische Methoden, Attribute und Instanzattribute von Klassen in ES6-Javascript

Das obige ist der detaillierte Inhalt vonWie kann die Suchkomponente von mint-ui die Suchschaltfläche auf der Tastatur anzeigen?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!