ivew组件table头通过renderHeader函数添加可选项以及改变列值以及table中render函数的使用

最新推荐文章于 2024-12-07 14:30:06 发布

梨子ππ

最新推荐文章于 2024-12-07 14:30:06 发布

阅读量1k

点赞数 1

文章标签： vue vue.js html es6 javascript

本文链接：https://blog.csdn.net/lch1399038292/article/details/117250021

版权

本文介绍了如何在ivew组件的table中利用renderHeader函数为表头添加可选项，并改变列值。此外，还展示了如何在表格中添加操作按钮，以及结合Poptip组件进行提示功能的实现。

摘要由CSDN通过智能技术生成

1、table头通过renderHeader函数添加可选项以及改变列值

 { key: 'UrlSys',
          title: '测试1',
          tooltip: true,
          renderHeader: (h, params) => {
            return this.renderSelectTableColumn(h, params)
          }
        }

 renderSelectTableColumn (h, params) {
      let edit
      let options = this.typeList.map(v => {
        return h('Option', {
          props: {
            value: v.value
          }
        }, v.value)
      })
      edit = [h('Select', {
        props: {
          value: params.column.title,
          placement: 'bottom-end',
          transfer: true
        },
        class: { 'select-style': true },
        style: { marginLeft: '-8px', marginRight: '8px' },
        on: {
          in