vue实现表格中添加标签,标签是多个需要循环-render函数 for循环返回

vue实现表格中添加标签,标签是多个需要循环--

实现:render函数 for循环返回多个div

fields_columns:[
  {
    type: 'index',
    width: 60,
    align: 'center'
  },{
    title: '字段',
    sortable: true,
    ellipsis:true,
    width: 200,
    key: 'column_name'
  },{
    title: '类型',
    width: 200,
    ellipsis:true,
    key: 'column_type'
  },{
    title: '注释',
    ellipsis:true,
    width: 300,
    key: 'commentString'
  },{
    title: "安全等级",
    width: 100,
    render: (h, params) => {
      let tag = params.row.tag_safe;
      if(tag){
        return h("div", [
          h("h-tag", {props: {color: "green"}},"安全"+tag+"级"),
        ]);
      }
    }
  },{
    title: "标签",
    width: 300,
    render: (h, params) => {
      let tag = params.row.tag_content_list;
      return h("div", [
        tag.map(function (items,index){
          return h("h-tag", {props: {color: "yellow"}},items.tag_content)
        }),
        h("Button", {props: {icon:"ios-plus-empty",type:"dashed",size:"small"}}, "添加标签")
      ]);

效果:

 

posted @ 2022-09-13 11:35  Tim&Blog  阅读(511)  评论(0编辑  收藏  举报