V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
V2EX 提问指南
Newyorkcity
V2EX  ›  问与答

请问 elementUI 的表格上想添一行按钮,但看起来让两者完美融洽好似一体,有好的解决方案么?

  •  
  •   Newyorkcity · 2020-01-11 14:47:37 +08:00 · 2425 次点击
    这是一个创建于 1807 天前的主题,其中的信息可能已经有所发展或是发生改变。

    计划效果

    如图,最上面的操作,刷新那一行以及整体非常融洽的感觉就是我想要的效果。

    我的尝试

    我自己进行尝试的话,就只能想到两个 div,一个 div 放 button,一个 div 装 elementui 的 el-table。。。 但出现如上图的奇怪问题,我很确定两个 div 以及 el-table 元素最终生成的.el-table元素的宽度都是相等的,外边距和边框都在 F12 控制台看过,但最终效果却是如图所示,有点没对齐,也不知道为什。。。

    谢谢解答!

    6 条回复    2020-01-11 18:17:55 +08:00
    izoabr
        1
    izoabr  
       2020-01-11 16:57:51 +08:00
    el-table 不支持自定义 Table Header 么? antd 可以。
    loading
        2
    loading  
       2020-01-11 17:21:01 +08:00
    不知直接加就可以了吗?
    反正我行内加了很多,thead 不能加吗?
    Newyorkcity
        3
    Newyorkcity  
    OP
       2020-01-11 17:25:07 +08:00
    @izoabr
    倒不能说完全没有,它支持在表格的标题那一行自己最后添加一列自定义的,但是还得想好给这多生成的一列,在之后的内容行里放下啥,官方样式是放几个修改,删除的按钮。。

    @loading
    能否再说的详细一些? el-table 不都是指定绑定的数据后根据它自行生成行么?
    loading
        4
    loading  
       2020-01-11 18:15:04 +08:00
    我真的不知道你有没有看文档。
    element.eleme.cn/#/zh-CN/component/table#zi-ding-yi-biao-tou

    随手就改个 codepen 出来:看 html 65 行

    codepen.io/fengz/pen/yLyjPqJ
    loading
        5
    loading  
       2020-01-11 18:16:07 +08:00
    63-71 行
    loading
        6
    loading  
       2020-01-11 18:17:55 +08:00
    你这个结合多级表头就可以实现了,外观不满意就 css。
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   5506 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 30ms · UTC 05:51 · PVG 13:51 · LAX 21:51 · JFK 00:51
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.