vue中使用iview一个数据分红两列渲染(render,竖列,左右不一样数据)

我在项目中有一个需求是下面这样的样式javascript

 开始的思路是使用iview中的table的columns,给表头数据数据使用render渲染不一样的数据(以下)java

{
            title: '旧版本',
            key: 'name',
            align: 'center',
            render: (h, params) => {
              if (this.data3.length !== 0) {
                if (!this.data3[params.index].showSelect) {
                  return h(
                    'div',
                    [
                      h('strong', {
                      }, this.data3[params.index].name)
                    ]
                  );
                } else {
                  return h(
                    'div',
                    [
                      h('Button', {
                      }, '选择')
                    ]
                  );
                }
              } else {
                return h(
                  'div',
                  [
                    h('Button', {
                    }, '选择')
                  ]
                );
              }
            }
          },
          {
            title: '新版本',
            key: 'name',
            align: 'center',
            render: (h, params) => {
              return h(
                'div',
                [
                  h('strong', {
                  }, this.data4[params.index].name)
                ]
              );
            }
          }

 但是后来发现咱们的需求这种形式没法知足,因此我就改变了一种思路,把旧版本和新版本的数据都存在一个对象中,放到一个数组里面,再拿这个数组进行渲染就能够了,代码以下(由于在项目中,代码可能贴的不全,贴点主要代码)数组

arr.push({
              oldName: '',
              ohash1: '',
              id: '-1',
              newName: nval.name,
              nhash1: nval.sha1_hash,
              newFile: nval.file
            })

直接用这个数组在iview的table中渲染就能够了iview