Maison  >  Article  >  interface Web  >  Vue implémente une méthode de mise en évidence des clics d'étiquettes

Vue implémente une méthode de mise en évidence des clics d'étiquettes

亚连
亚连original
2018-05-29 17:06:362481parcourir

Maintenant, je vais partager avec vous une méthode pour implémenter une mise en surbrillance de clic de balise dans Vue. Elle a une bonne valeur de référence et j'espère qu'elle sera utile à tout le monde.

est le suivant :

<!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:
&#39;#app&#39;,
data: {
Alist: [{
name:
&#39;影视大咖&#39;
}, {
name:
&#39;女明星&#39;
}, {
name:
&#39;男明星&#39;
}, {
name:
&#39;商业大亨&#39;
}],
active:
&#39;&#39;
},
mounted() {
},
methods: {
selected(name) {
this.active
= name;
}
}
})
</script>
</body>
</html>

Ce qui précède est ce que j'ai compilé pour vous, j'espère que cela sera utile à tout le monde à l'avenir.

Articles associés :

Exemple de vérification Ajax basée sur jQuery pour vérifier si le nom d'utilisateur est disponible

Entrer le déclencheur bouton implémenté par jQuery Exemple de fonction d'événement

jQuery+Cookie implémente la fonction de changement de skin

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn