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

相关推荐
WeiXin_DZbishe2 分钟前
基于springboot大学生提问箱系统-计算机毕设【课程设计】72593
javascript·vue.js·spring boot·vscode·python·node.js·php
yume_sibai4 分钟前
ES6 核心知识点完全总结(变量 + 箭头函数 + 解构 + Promise + 模块化)
前端·ecmascript·es6
tryCbest35 分钟前
Vue Router学习及使用
前端·vue.js
何何____1 小时前
js常见继承方法详解
前端·javascript
梨想橙汁1 小时前
Vue2 快速入门:环境搭建、模板语法、指令系统全解
前端·vue.js
吴长建先生2 小时前
5步搞定random access memories源码解析 告别报错
vue.js
蜡台2 小时前
Vue 3 原生 ESM 开发实战:不用打包工具,从零搭建组件化应用
前端·javascript·vue.js·html
用户298698530142 小时前
在 React 中使用 JavaScript 将 HTML 转换为图片
javascript·react.js·html
寻缘千鹤2 小时前
LogicFlow流程图 PNG 导出「线上按钮置灰、无反应」故障复盘
前端·javascript·vue.js
10share2 小时前
给 JSX 组件也来一份 Vue 式 scoped:jsx-scoped 让样式隔离不再靠自觉
前端·vue.js