【vue】v-for只显示前几个数据,超出显示查看更多

v-for只显示前几个数据,超出显示查看更多

如图

复制代码
<div v-for="(item,index) in list.slice(0,3)" :key="index">
    <div class="degreeNo" :class="index=='0'?'noOne':index=='1'?'noTwo':index=='2'?'noThree':''">
NO{{index+1}}:
    </div>
    <div class="degreeName">{{item.name}}</div>
</div>
<div class="moreBtn" v-if="list && list.length>3">
    <el-button type="text" @click="checkMore">查看更多</el-button>

</div>
相关推荐
程序员爱钓鱼1 分钟前
Node.js 编程实战:测试与调试 —— 日志与监控方案
前端·后端·node.js
计算机学姐7 分钟前
基于SpringBoot的汉服租赁系统【颜色尺码套装+个性化推荐算法+数据可视化统计】
java·vue.js·spring boot·后端·mysql·信息可视化·推荐算法
+VX:Fegn08958 分钟前
计算机毕业设计|基于springboot + vue建筑材料管理系统(源码+数据库+文档)
数据库·vue.js·spring boot·后端·课程设计
Mapmost10 分钟前
数字孪生项目效率翻倍!AI技术实测与场景验证实录
前端
小酒星小杜14 分钟前
在AI时代,技术人应该每天都要花两小时来构建一个自身的构建系统-Input篇
前端·程序员·架构
雪碧聊技术15 分钟前
ElementPlus徽章组件:展示日期面板每天未完成的待办数量
vue.js·日期选择器·elementplus·el-badge徽章组件
Cache技术分享22 分钟前
290. Java Stream API - 从文本文件的行创建 Stream
前端·后端
陈_杨24 分钟前
前端成功转鸿蒙开发者真实案例,教大家如何开发鸿蒙APP--ArkTS 卡片开发完全指南
前端·harmonyos
小杨同学4930 分钟前
C 语言实战:枚举类型实现数字转星期(输入 1~7 对应星期几)
前端·后端
陈_杨32 分钟前
前端成功转鸿蒙开发者真实案例,教大家如何开发鸿蒙APP--ArkTS 卡片刷新机制
前端·harmonyos