01 v-for循环绑定类名 v-bind 结合三目运算 动态添加类

简介: 01 v-for循环绑定类名 v-bind 结合三目运算 动态添加类

3==》v-for循环 绑定类名 在添加一个类

 


class="show-icon-div" 无论如何都有的


<i class="iconfont" :class="itemIcon"></i>  第二个:class="itemIcon"是动态绑定的   在添加一个class

 

<div v-for="(itemIcon, index) in asideMenuIcon" :key="index" class="show-icon-div" @click="handlerMessage"><i class="iconfont" :class="itemIcon"></i></div>
//右侧菜单icon
asideMenuIcon:["iconshuaxin","iconshuaxin","iconshuaxin","iconshuaxin","iconshuaxin"]

 

4==》v-bind 结合三目运算 动态添加类


<!--asideclickafter 是类名,无论怎样都会显示。    


MenuConFlag 是否显示300区域  是变量 。


newmenposition类名,小图重新定位。  

 

rightmenu 是一个类名  rightmenu小图最初的定位。-->


<div :class="['asideclickafter', MenuConFlag ? 'newmenposition' : 'rightmenu' ]" v-if="asideWidthFlag">   </div>
相关文章
|
开发工具 git
Git区分文件名大小写
Git默认不区分文件名大小写 例如:创建一个文件readme.md,写入内容,提交到线上仓库,然后修改本地文件名为Readme.md,提交,会发现没有变化,无任何提示信息 其实Git默认对于文件名大小写是不敏感的,所以上面你修改了首字母大写,但是Git并没有发现代码任何改动.
11517 1
|
前端开发 索引
webpack window 使用sass来编译css样式
1.执行安装: npm install sass-loader --save-dev (此处不行的话就换上npm install node-sass) 2.稍微修改一下config,删掉我们先前添加的css规则,加上下面的loader { test: /\.
1049 0
|
2天前
|
弹性计算 关系型数据库 微服务
基于 Docker 与 Kubernetes(K3s)的微服务:阿里云生产环境扩容实践
在微服务架构中,如何实现“稳定扩容”与“成本可控”是企业面临的核心挑战。本文结合 Python FastAPI 微服务实战,详解如何基于阿里云基础设施,利用 Docker 封装服务、K3s 实现容器编排,构建生产级微服务架构。内容涵盖容器构建、集群部署、自动扩缩容、可观测性等关键环节,适配阿里云资源特性与服务生态,助力企业打造低成本、高可靠、易扩展的微服务解决方案。
1083 0
|
11天前
|
人工智能 运维 安全
|
1天前
|
机器学习/深度学习 人工智能 前端开发
通义DeepResearch全面开源!同步分享可落地的高阶Agent构建方法论
通义研究团队开源发布通义 DeepResearch —— 首个在性能上可与 OpenAI DeepResearch 相媲美、并在多项权威基准测试中取得领先表现的全开源 Web Agent。
341 0
|
10天前
|
人工智能 测试技术 API
智能体(AI Agent)搭建全攻略:从概念到实践的终极指南
在人工智能浪潮中,智能体(AI Agent)正成为变革性技术。它们具备自主决策、环境感知、任务执行等能力,广泛应用于日常任务与商业流程。本文详解智能体概念、架构及七步搭建指南,助你打造专属智能体,迎接智能自动化新时代。
|
2天前
|
弹性计算 Kubernetes jenkins
如何在 ECS/EKS 集群中有效使用 Jenkins
本文探讨了如何将 Jenkins 与 AWS ECS 和 EKS 集群集成,以构建高效、灵活且具备自动扩缩容能力的 CI/CD 流水线,提升软件交付效率并优化资源成本。
271 0
|
9天前
|
人工智能 异构计算
敬请锁定《C位面对面》,洞察通用计算如何在AI时代持续赋能企业创新,助力业务发展!
敬请锁定《C位面对面》,洞察通用计算如何在AI时代持续赋能企业创新,助力业务发展!
|
10天前
|
机器学习/深度学习 人工智能 自然语言处理
B站开源IndexTTS2,用极致表现力颠覆听觉体验
在语音合成技术不断演进的背景下,早期版本的IndexTTS虽然在多场景应用中展现出良好的表现,但在情感表达的细腻度与时长控制的精准性方面仍存在提升空间。为了解决这些问题,并进一步推动零样本语音合成在实际场景中的落地能力,B站语音团队对模型架构与训练策略进行了深度优化,推出了全新一代语音合成模型——IndexTTS2 。
766 23