iview table中的render函数使用


1.表格列数据内容过多可以用以下两个属性解决:

  

ellipsis:"true',
tooltip:true

使每个列的内容如果过多的话变为省略号

2.table中的render函数(实现根据表格内容条件是否展示按钮)

columns:[
  {
   title:'审批状态',
   key:'status',
   render:(h,params)=>{
    const status = params.row.status;
    var text = ''
    switch(status){
      case 100:
        text = '待审核',
        break;
      case 200:
        text = '审核未通过'
        break;
      case 300:
        text = '审核通过'
        break;
    }
    return h('div',text)
   }
  },
 {
  title:'操作',
  key:"oprator",
  render:(h,params)=>{
  let arr = []
  if(params.row.status === '100'){
    arr.push(
     h(
     "Button",
    {
      props:{
        type:"warning",
        size:"small",
        icon:"md-create"
      },
     style:{
       marginRight:"5px"
     },
     on:{
       lick:()=>{
         this.applyDetail(params.row.demandId);
       }  
      }
    },
    "申请详情"
    )
   )
 }
  return h('div',arr)
  }
  }
]

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM