iview table的render()函數的用法

語法：render:(h,params)=>{}

render:(h,params) => {
  return h(" 定義的元素 "，{ 元素的性質 }，" 元素的內容"/[元素的內容])
}

當定義的元素沒有其他元素時：

render:(h,params)=>{
    return h('div', {style:{width:'100px',height:'100px',background:'#ccc'}}, '地方')
}

當定義的元素中要嵌套其他元素時：

render:(h,params)=>{
     return h('div',{style:{width:'100px',height:'100px',background:'#ccc'}},[h('p','內容2')],'內容1')
}

我們可以嵌套3層元素來完成，來看看第一二層元素的嵌套：

render:(h, params) => {
  return h('div',[
                  h('div',{style:{float:'left',width:'50px',height:'50px',background:'#ccc'}},[h('p','內容2')]),
                  h('div',{style:{float:'left',width:'50px',height:'50px',background:'#fc1'}},[h('p','內容2')])
                ])
}

元素如何綁定事件：

on: {
    click: () => {console.log('ffff')},
    mouseover:() => { console.log('bbb')}
 }

如何根據后台的數據判斷是否顯示某些元素：

{
            title: '操作',
            align:'center',
            width:130,
            render:(h, params) => {
              let status = params.row.Status; //0:空閑  1:游戲  2:未上線
              if (status===0){ return h('Button','空閑中') };
              if (status===1){ return h('Button','游戲中')};
              if (status===2){ return ""} //未上線時不顯示}
}

原文：https://www.jianshu.com/p/f44a32f83cc8