vue active样式显示


html:代码
<ul>
            <li @click="current='xxxx'" :class="{active:current=='xxxx'}">休息休息</li>
            <li @click="current='xxxx1'" :class="{active:current=='xxxx1'}">休息休息</li>
            <li @click="current='xxxx2'" :class="{active:current=='xxxx2'}">休息休息</li>
            <li @click="current='xxxx3'" :class="{active:current=='xxxx3'}">休息休息</li>
        </ul>
css样式:
.active {
        background: rgb(21,149,136);
        color: white;
        border: 1px solid green;
    }
js代码:
export default {
    name: '',
    data() {
      return {
        current:'xxxx',
      }
    },
}

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM