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

相关推荐
华洛2 分钟前
我用AI做了一个48秒的真人精品漫剧,不难也不贵
前端·javascript·后端
Amumu1213837 分钟前
Js:正则表达式(二)
开发语言·javascript·正则表达式
Sgf2271 小时前
ES8(ES2017)新特性完整指南
开发语言·javascript·ecmascript
Cobyte4 小时前
1.基于依赖追踪和触发的响应式系统的本质
前端·javascript·vue.js
老神在在0014 小时前
【Selenium 自动化精讲】浏览器弹窗与登录界面的本质区别 & 实操指南
javascript·学习·selenium·测试工具·自动化
计算机学姐4 小时前
基于SpringBoot的咖啡店管理系统【个性化推荐+数据可视化统计+配送信息】
java·vue.js·spring boot·后端·mysql·信息可视化·tomcat
前端小咸鱼一条4 小时前
16.迭代器 和 生成器
开发语言·前端·javascript
web守墓人5 小时前
【前端】记一次将ruoyi vue3 element-plus迁移到arco design vue的经历
前端·vue.js·arco design
前端小阳5 小时前
JavaScript原型链
javascript
早點睡3905 小时前
ReactNative项目OpenHarmony三方库集成实战:react-native-collapsible
javascript·react native·react.js