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 就可以,像调方法一样传事件参数即可

相关推荐
雪芽蓝域zzs1 小时前
第十六节:递归组件实现无限层级折叠侧边栏菜单
开发语言·javascript·ecmascript
BillKu2 小时前
vue3 字符串排序 localeCompare,确保排序为 “B01“, “B10“, “B2“
前端·javascript·vue.js
Nayana2 小时前
《Web 到 HarmonyOS》-- 第一课:前端经验哪些能带走
vue.js·harmonyos
然我2 小时前
从 Service 到生命周期:Agent Runtime 的插件内核
前端·javascript·agent
用户6919026813393 小时前
Agent 记忆处理机制详解:从变量数据类型到内存模型
javascript·架构
ShineWinsu3 小时前
对于 Vue 3:开发前需要掌握的 JavaScript 核心基础:从变量、数组方法到 Promise、Async/Await 与 ES Module 的解析
javascript·vue.js·elasticsearch
晴天163 小时前
Tsup:TypeScript库打包的“零配置极速方案”
前端·javascript·typescript
雪芽蓝域zzs4 小时前
第十七节:面包屑导航组件(适配多级嵌套路由)
前端·javascript·vue.js
smileNicky4 小时前
React 弹窗组件如何在新标签页打开?
javascript·react.js·ecmascript
yume_sibai4 小时前
Element Plus 其他实用组件完全指南(10个核心组件)
前端·javascript·vue.js