suchen

Heim >Web-Frontend >js-Tutorial >Verwenden Sie Vue, um das A-Tag hervorzuheben, wenn Sie darauf klicken (Code angehängt)

Verwenden Sie Vue, um das A-Tag hervorzuheben, wenn Sie darauf klicken (Code angehängt)

php中世界最好的语言
php中世界最好的语言Original
2018-05-10 15:10:062567Durchsuche

Dieses Mal werde ich Ihnen die Vorsichtsmaßnahmen zur Verwendung von Vue zum Hervorheben des Tags „a“ vorstellen, indem Sie darauf klicken (Code beigefügt). Welche

Vorsichtsmaßnahmen

gelten für die Verwendung von Vue zum Hervorheben? Ein Tag durch Anklicken. Das Folgende ist ein praktischer Fall. lautet wie folgt: 

<!DOCTYPE html>
<html
lang="en">
<head>
<title></title>
<meta
charset="UTF-8">
<meta
name="viewport"
content="width=device-width, initial-scale=1">
<!--<link href="css/style.css" rel="external nofollow" rel="stylesheet">-->
<script
src="js/jquery.js"></script>
<script
src="js/vue(2.0).js"></script>
<style
lang="less"
rel="stylesheet/less">
.a {
display:
block;
float:
left;
margin-left:
20px;
}
.active {
color:
red;
font-size:
17px;
}
</style>
</head>
<body>
<p
id="app">
<a
class="s-bt" @click="selected(Aname.name)"
 :class="{active: active == Aname.name}"
v-for="Aname in Alist">{{Aname.name}}</a>
</p>
<script>
new
Vue({
el:
'#app',
data: {
Alist: [{
name:
'影视大咖'
}, {
name:
'女明星'
}, {
name:
'男明星'
}, {
name:
'商业大亨'
}],
active:
''
},
mounted() {
},
methods: {
selected(name) {
this.active
= name;
}
}
})
</script>
</body>
</html>

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie den Fall in diesem Artikel gelesen haben, bitte Achten Sie auf andere verwandte Themen im Artikel zur chinesischen PHP-Website!

Empfohlene Lektüre:
Echarts-Maus-Overlay hebt die Implementierungsschritte für Knotenbeziehungsnummern hervor


nodejs generiert QR-Code ( Am prägnantesten )

Das obige ist der detaillierte Inhalt vonVerwenden Sie Vue, um das A-Tag hervorzuheben, wenn Sie darauf klicken (Code angehängt). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：vue+Echarts implementiert Klick-Hervorhebung (mit Code)Nächster Artikel：vue+Echarts implementiert Klick-Hervorhebung (mit Code)

In Verbindung stehende Artikel

Mehr sehen