1. 程式人生 > >iview table行render渲染不同的組件

iview table行render渲染不同的組件

ber urn rop src number width tab 不同 ops

table不同的行,相同的列渲染不同的組件,如圖1:第一行渲染selece,第二行渲染input

render:(h,params)=>{
if(params.index === 0){ //以params.index為條件渲染
return h(‘div‘,[
h(‘Input‘,{
props:{

},
style:{},
on:{
‘on-change‘:(e)=>{
console.log(e.target.value)
}
}
})
])
};
if(params.index === 1){

return h(‘div‘,[
h(‘Select‘,{
props:{

},
style:{},
on:{
‘on-change‘:(e)=>{
console.log(e.target.value)
}
}
})
])
};
if(params.index === 2){
return h(‘div‘,[
h(‘InputNumber‘,{
props:{
min:0
},
style:{
width:‘100%‘
},
on:{
‘on-change‘:(e)=>{
console.log(e.target.value)
}
}
})
])
};
}
技術分享圖片

iview table行render渲染不同的組件