189  
查询码:00000685
如何在iview表格中使用select标签
作者: 徐文斌 于 2019年12月26日 发布在分类 / 人防组 / 人防前端 下,并于 2019年12月26日 编辑
在iview表格中使用select标签

图例

粘贴图片

实现方法

参数功能

参数 功能描述
style 样式
props 绑定数值以及一些api设置
on 绑定相关方法,例如点击事件
api具体值设置以及相关方法请参考 https://www.iviewui.com/components/select#API

代码块

{
          title: "企业名称",
          key: "enterpriseId",
          align: "center",
          render: (h, params) => {
            return h("div", [
              h(
                "Select",
                {
                  style: {
                  },
                  props: {
                    value: this.groupData[params.index].enterpriseId,
                    placement: "top",
                    filterable: true,
                    clearable: true,
                    allowCreate: true
                  },
                  on: {
                    "on-change": event => {
                      this.groupData[params.index].enterpriseId = event;
                      params.row.enterpriseId = event;
                      this.ShowCompanyInfo(params.row, params.index);
                    },
                    "on-create": event => {
                      this.addEnterprise(event);
                    }
                  }
                },
                this.enterpriseList.map((item, itemIndex) => {
                  return h(
                    "Option",
                    {
                      props: {
                        value: item.id,
                        key: item.id
                      }
                    },
                    item.name
                  );
                })
              )
            ]);
          }
        }
注意

循环option的时候不要用forEach,forEach在render函数中不起作用,此处应用map。



 推荐知识

 历史版本

修改日期 修改人 备注
2019-12-26 15:35:27[当前版本] 徐文斌 在iview表格中使用select标签

 附件

附件类型

PNGPNG

知识分享平台 -V 4.8.7 -wcp