iview数据列表操作栏对操作按钮隐藏

落日映苍穹つ 2022-11-30 01:27 273阅读 0赞

基本代码：

columns1: [
            {
              type: "index",
              width: 80,
              align: "center",
              title: "序号"
            },
            {
              title: "设备类型编码",
              key: "typeCode",
              sortable: true
            },
            {
              title: "设备类型名称",
              key: "typeName",
              sortable: true
            },
            {
              title: "设备所属类别",
              key: "type"
            },
            {
              title: "设备类型描述",
              key: "typeDesc",
              tooltip: true
            },
            {
              title: "状态",
              key: "state",
              width: 100,
              render: (h, params) => {
                if (params.row.state == "A") {
                  return h("span",{
                    style:{
                      color:"rgb(37, 155, 36)"
                    }
                  },"启用");
                } else {
                  return h("span",{
                    style:{
                      color:"rgb(255, 152, 0)"
                    }
                  }, "禁用");
                }
              }
            },
            {
              title: "创建时间",
              key: "datetimeCreated",
              sortable: true,
              render: (h, params) => {
                return h(
                  "div",
                  formatDate(
                    new Date(params.row.datetimeCreated),
                    "yyyy-MM-dd hh:mm"
                  )
                );
              }
            },
            {
              title: "创建人",
              key: "userName"
            },
            {
              title: "操作",
              key: "createTime",
              render: (h, params) => {
                return h("div", [
                  h(
                    "el-button",
                    {
                      props: {
                        type: "text",
                        size: "small"
                      },
                      style: {
                        marginRight: "0px",
                        display:(params.row.type=="产品类别")?"none":"inline-block",
                      },
                      on: {
                        click: () => {
                          this.formValidate.typeName = params.row.typeName; //验证码	string	必填
                          this.formValidate.typeCode = params.row.typeCode;
                          this.formValidate.typeDesc = params.row.typeDesc;
                          this.formValidate.state = params.row.state;
                          this.formValidate.type = params.row.type;
                          this.formValidate.id = params.row.id;
                          if(params.row.state=='A'){
                            this.formValidate.state = true
                          }else{
                             this.formValidate.state = false
                          }
                            this.modal2 = true;
                        }
                      }
                    },
                    "修改"
                  ),
                  h(
                    "el-button",
                    {
                      props: {
                        type: "text",
                        size: "small"
                      },
                      style: {
                        marginRight: "0px",
                        display:(params.row.type=="产品类别")?"none":"inline-block",
                      },
                      on: {
                        click: () => {
                          this.$confirm("是否确定删除数据?", "提示", {
                            confirmButtonText: "确定",
                            cancelButtonText: "取消",
                            type: "warning"
                          })
                            .then(() => {
                              this.removeById(params.row.id);
                            })
                            .catch(() => {
                              this.$message({
                                type: "info",
                                message: "已取消删除"
                              });
                            });
    
                          //
                        }
                      }
                    },
                    "删除"
                  )
                ]);
              }
            }
          ],

核心代码：

style: {
                        marginRight: "0px",
                        display:(params.row.type=="产品类别")?"none":"inline-block",
                      },

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4NTU1NDkw_size_16_color_FFFFFF_t_70][]

效果图：

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4NTU1NDkw_size_16_color_FFFFFF_t_70 1][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4NTU1NDkw_size_16_color_FFFFFF_t_70]: /images/20221124/97e9411637ca4115944eb542585f1820.png
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM4NTU1NDkw_size_16_color_FFFFFF_t_70 1]: /images/20221124/062ffae0f2104abfbe4c49f1c8027ef3.png