vue實(shí)現(xiàn)點(diǎn)擊選中,其他的不選中方法
更新時間:2018年09月05日 15:56:20 作者:Alice9969
今天小編就為大家分享一篇vue實(shí)現(xiàn)點(diǎn)擊選中,其他的不選中方法,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧
如下所示:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>選中效果</title> <script src="../static/js/vue.min.js"></script> <style> ul li.active{ color: green; } </style> </head> <body> <div id="app"> <ul> <li v-for="items in navList" :class="{active:items.isActive}" @click="activeFun(items)"> <a> {{items.text}} </a> </li> </ul> </div> <script> new Vue({ el: '#app', data: { navList: [ {text: '首頁', isActive: true}, {text: '簡介', isActive: false}, {text: '活動', isActive: false}, {text: '聯(lián)系', isActive: false} ] }, methods: { activeFun: function(data){ this.navList.forEach(function(obj){ obj.isActive = false; }); data.isActive = !data.isActive; } } }); </script> </body> </html>
以上這篇vue實(shí)現(xiàn)點(diǎn)擊選中,其他的不選中方法就是小編分享給大家的全部內(nèi)容了,希望能給大家一個參考,也希望大家多多支持腳本之家。
相關(guān)文章
vue.js el-table動態(tài)單元格列合并方式
這篇文章主要介紹了vue.js el-table動態(tài)單元格列合并方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-02-02vant中l(wèi)ist的使用以及首次加載觸發(fā)兩次解決問題
這篇文章主要介紹了vant中l(wèi)ist的使用以及首次加載觸發(fā)兩次解決問題,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-10-10Vue實(shí)現(xiàn)contenteditable元素雙向綁定的方法詳解
contenteditable是所有HTML元素都有的枚舉屬性,表示元素是否可以被用戶編輯。本文將詳細(xì)介紹如何實(shí)現(xiàn)contenteditable元素的雙向綁定,需要的可以參考一下2022-05-05vue調(diào)試工具vue-devtools安裝及使用方法
本文主要介紹 vue的調(diào)試工具 vue-devtools 的安裝和使用,本文給大家介紹的非常詳細(xì),具有一定的參考借鑒價值,需要的朋友參考下吧2018-11-11vue實(shí)現(xiàn)excel文件的導(dǎo)入和讀取完整步驟
Vue的數(shù)據(jù)綁定功能非常強(qiáng)大,很適合用來讀取Excel內(nèi)容,這篇文章主要給大家介紹了關(guān)于vue實(shí)現(xiàn)excel文件的導(dǎo)入和讀取的相關(guān)資料,文中通過代碼示例介紹的非常詳細(xì),需要的朋友可以參考下2023-10-10vue.js出現(xiàn)Vue.js?not?detected錯誤的解決方案
這篇文章主要介紹了vue.js出現(xiàn)Vue.js?not?detected錯誤的解決方案,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-09-09vue實(shí)現(xiàn)監(jiān)聽localstorage值變化
這篇文章主要介紹了vue實(shí)現(xiàn)監(jiān)聽localstorage值變化,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2022-08-08