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