iview table里面的按钮，如何在一定情况下出现，一定情况下不出现

Question

用的iview的table组件，希望删除按钮在一定情况下出现，一定情况下隐藏，我现在的代码是下边的。请问如何修改下能实现这个需求呢？

            title: '操作',
            key: 'state',
            render: (h, params) => {
              return h('div', [
                h('Button', {
                  props: {
                    type: 'primary',
                    size: 'small',
                  },
                  style: {
                    marginRight: '5px',
                    fontSize: '5px',
                  },
                  on: {
                    click: () => {
                      this.appDetail(params.index)
                    }
                  }
                }, '详情'),
                h('Button', {
                  props: {
                    type: 'error',
                    size: 'small'
                  },
                  style: {
                    marginleft: '5px',
                    fontSize: '5px',
                  },
                  on: {
                    click: () => {
                      this.deleteApp(params.index)
                    }
                  }
                }, '删除'),
                h('Button', {
                  props: {
                    type: 'warning',
                    size: 'small'
                  },
                  style: {
                    marginleft: '5px',
                    fontSize: '5px',
                  },
                  on: {
                    click: () => {
                      this.modifyApp(params.index)
                    }
                  }
                }, '修改'),

              ]);
            }

Answer 1

                     {
                         title: '操作',
                         align: 'center',
                         width: 120,
                         render: (h, params) => {
                             console.log('params='+JSON.stringify(params))
                             return h('div', [
                                 h('Button', {
                                     props: {
                                         type: 'primary',
                                         size: 'small'
                                     },
                                     style: {
                                         marginRight: '5px',
                                         display:(params.row.picNames==null)?"none":"inline-block",
                                     },
                                     on: { click: () => {
                                         this.showPicModal(params.index)
                                     }
                                     }
                                 }, '查看图像'),

                             ])
                         }
                     }

我的是根据后台返回的值params.row.picNames==null，加上这段display:(params.row.picNames==null)?"none":"inline-block",可以控制显示隐藏。

Answer 2

采用jsx写法，然后利用v-if去控制

Answer 3

我用opacity加row的属性

Answer 4

楼主解决了吗？求助啊