Vue implementiert das Umschalten des Anmeldetyps
|
In diesem Artikelbeispiel wird der spezifische Code von Vue zur Implementierung des Login-Typ-Wechsels zu Ihrer Information geteilt. Der spezifische Inhalt ist wie folgt Wirkung der Operation
Code
<!DOCTYPE html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<title>Anmeldetyp wechseln</title>
<script src="../js/vuejs-2.5.16.js"></script>
</Kopf>
<Text>
<div id="app">
<span v-if="istBenutzer">
<label for="userAccount">Benutzerkonto:</label>
<input type="text" id="userAccount" placeholder="Bitte geben Sie Ihr Konto ein" key="userAccount">
</span>
<span v-else>
<label for="userEmail">Benutzer-E-Mail:</label>
<input type="text" id="userEmail" placeholder="Bitte geben Sie Ihre E-Mail-Adresse ein" key="userEmail">
</span>
<button @click="changeType">Typ wechseln</button>
</div>
</body>
<Skript>
const app = new Vue({
el: '#app',
Daten: {
isUser: true
},
Methoden:{
Typ ändern(){
gibt dies zurück.istBenutzer = !dies.istBenutzer
}
}
})
</Skript>
</html>Code-Snippet-Analyse
Das Obige ist der vollständige Inhalt dieses Artikels. Ich hoffe, er wird für jedermanns Studium hilfreich sein. Ich hoffe auch, dass jeder 123WORDPRESS.COM unterstützen wird. Das könnte Sie auch interessieren:
|
<<: Erläuterung des Prozesses des Docker-Packaging-Node-Projekts
>>: Detaillierte Erklärung redundanter und doppelter Indizes in MySQL
Artikel empfehlen
Eine kurze Einführung in Linux-Umgebungsvariablendateien
Im Linux-System können Umgebungsvariablen entspre...
Beispielcode zum Implementieren der unteren Ausrichtung auf verschiedene Arten mit CSS
Aufgrund der Geschäftsanforderungen des Unternehm...
CSS-Code zur Steuerung der Hintergrundfarbe der Webseite
Ich glaube, jeder macht sich oft Sorgen, ob er Bi...
Vue implementiert Pulldown, um mehr zu laden
Entwickler, die mit Element-UI vertraut sind, hab...
URL-Darstellung in HTML-Webseiten
In HTML werden gängige URLs auf verschiedene Arten...
Detaillierte Erläuterung des Prozesses zum Einrichten einer NVIDIA-Docker-Umgebung auf einem Linux-Server
Docker entspricht einem Container, der je nach de...
JavaScript implementiert das mobile Puzzlespiel mit neun Rastern
In diesem Artikel wird der spezifische Code für J...
So schreiben Sie mithilfe von Filtern transparentes CSS für Bilder
So schreiben Sie mithilfe von Filtern transparente...
Das Prinzip und die Anwendung der ES6-Dekonstruktionszuweisung
Inhaltsverzeichnis Array-Destrukturierungszuweisu...
Lösung für den Fehler beim Importieren von MySQL Big Data in Navicat
Die von Navicat exportierten Daten können nicht i...
Eine kurze Diskussion zum Verständnis von TypeScript-Indexsignaturen
Inhaltsverzeichnis 1. Was ist eine Indexsignatur?...
Installations-Tutorial für virtuelle VMware-Maschinen unter Ubuntu 18.04
Installationsschritte 1. Erstellen Sie eine virtu...
Bedeutung und Berechnungsmethode von QPS und TPS der MySQL-Datenbank
Bei DB-Benchmarktests sind QPS und TPS wichtige I...
Vue3 manuelle Kapselung Popup-Box-Komponente Nachrichtenmethode
In diesem Artikel wird der spezifische Code der m...
React tsx generiert einen zufälligen Bestätigungscode
React tsx generiert einen zufälligen Bestätigungs...