vue使用v-if和:class完成条件渲染

1.使用v-if 和v-else 完成主body和暂无数据两个**<tbody>**标签的条件渲染(注意与v-show效果的区别)

2.v-for完成列表渲染

3.:class完成分数标红的条件控制

删哪个就传哪个的id,基于这个id去过滤掉相同id的项,把剩下的项返回

javascript 复制代码
 <td><a @click.prevent="del(item.id)" href="http://www.baidu.com">删除</a></td>




 del (id) {
            // console.log(id)
            this.list = this.list.filter(item => item.id !== id)
          },

a标签的默认点击事件会跳转 这里要禁止默认事件

即使用@click.provent 就可以,像调方法一样传事件参数即可

相关推荐
独立开发之道13 小时前
【three.js教程】Three.js 材质详解:从“不反光“到“物理级真实“怎么选
开发语言·javascript·材质
waillyer14 小时前
企业知识库智能问答 Agent(React + Nest)
javascript·redis·agent
Dovis(誓平步青云)15 小时前
模拟器横评:电脑上看小说、追短剧用什么模拟器?MuMu、雷电、腾讯手游助手实测
android·java·服务器·前端·javascript·电脑
丁婷婷16 小时前
Reflect 在 Vue3 响应式中的作用是什么?
vue.js
xiaominlaopodaren16 小时前
three.js最小地图运行时(十):接入离线逻辑瓦片剖面
javascript·gis·three.js
吃西瓜的年年16 小时前
vue3原理思维导图
vue.js·笔记·flutter
Z小明16 小时前
第 1 章 Vite 项目初始化
前端·vue.js
合橱瑰16 小时前
Vue3 与 ElementPlus 前端常见错误修复实践
前端·vue.js
风之舞_yjf16 小时前
Vue基础(35)_全局事件总线(GlobalEventBus)
前端·vue.js
独立开发之道16 小时前
【Three.js教程】 图元速查:官方内置的立体图形
开发语言·javascript·ecmascript