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

相关推荐
kyriewen2 小时前
我排查了一个React内存泄漏——罪魁祸首是这3个被忽略的清理函数
前端·javascript·面试
其美杰布-富贵-李2 小时前
03 ref、reactive 与 computed 响应式数据
前端·javascript·vue.js
用户938515635072 小时前
useRef + Web Worker 实战:React 如何优雅地拥抱多线程
前端·javascript·react.js
嘟嘟07172 小时前
useRef + Web Worker:React 中的耗时计算不卡页面
javascript·vue.js
mONESY3 小时前
React Router v7 完全实战指南:从入门到鉴权,一套代码全搞定
javascript
万敏3 小时前
Vue3 全栈实战第五周:Vitest 单元测试从零搭建实战记录
vue.js·node.js·全栈
To_OC3 小时前
LC 74 搜索二维矩阵:换皮的二分查找,我居然一开始没看出来
javascript·算法·leetcode
橘子星3 小时前
一篇文章搞懂 useRef:聚焦 DOM、模拟 forceRender、管理 Worker 都靠它
前端·javascript
前端Hardy3 小时前
Vue 终于杀进终端界!这个开源项目让 CLI 开发像写网页一样简单
前端·javascript·后端
一次旅行3 小时前
多智能体编排实战:拆解Plan-and-Execute范式+三层记忆架构,手写无依赖轻量Agent调度引擎
前端·javascript·架构