alter table 加多个字段_Vue 组件设计 - table不需要封装

0a6404122f152d4eee4ac8fbd18090fc.png

table 为什么要封装?封装 table 组件的目的是什么?

比如诸如 ant design 之类的 UI 组件库,你会发现虚拟滚动表格甚至不使用 table tbody 等标签实现的,那这个表单组件还有称为表单组件的意义?

同样 ng-zorro 的 sticky header virtual scroll,检查会发现有两个 table 标签,一个包含 thead,一个控制 tbody,这样的封装也有点奇怪

不过,相比之下 ng-zorro 更接近我心目中的表单组件设计,即 ——

table并不需要封装成组件

以一个 zorro 组件为例:

8d6ffb03d804302b9df826e2a925be68.png

本身表格就是一个 行列两个map 的问题,但是里面有很多自定义,甚至多区域等问题,header 都有 col,row,colgroup,rowgroup 几种角色,虽然影响不到展示,但是会影响屏幕阅读器和导出

开发过程中遇到过很多类似财务报表的需求,使用 antd 甚至 element ui 的时候,会发现其远没有原生好用

而且,如果考虑到屏幕阅读器,对 exl 等文件格式之间的转换等问题,比如 sheetjs 即可实现 html table 和其它格式的转换

0a57087a92a4d624493b6ac168a98b3d.png

所以,是不是应该反对针对 table 的封装呢?原生的 table 它不香么?

以前,组件还承担部分逻辑处理的功能(比如数据筛选),但是现在逻辑都被服务+注入给包圆了,组件在这里就封装个样式,用 css 不它不香么?

反正这个问题我是没怎么想通的,希望大家能帮忙解惑

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值