vue的render方法
vue的render方法举3个例子来说明vue中的render方法这里截取片段代码来举3个例子例子1、data : {content : '',pageNo : '', //当前页码pageSize : 10, //每条页数tableSize:'', //总数props:{row:Object},jo...
·
vue的render方法
举3个例子来说明vue中的render方法
这里截取片段代码来举3个例子
例子1、
data : {
content : '',
pageNo : '', //当前页码
pageSize : 10, //每条页数
tableSize:'', //总数
props:{
row:Object
},
jobName : "",
JobData : [],
tableTitle:[ {
type:'expand',
width:50,
render:function(h,params){
var sj = '来源表sql:'+params.row.SOURCETABLESQL;
var sj1 = '目标表sql:'+params.row.OBJECTTABLESQL;
return h('div',[
h('div',{style:{float:'left',width:'1500px',background:'#ccc'}},[h('p',sj)]),
h('div',{style:{float:'left',width:'1500px',background:'#fc1'}},[h('p',sj1)])
])
}
}]
效果:
例子2、
data : {
content : '',
pageNo : '', //当前页码
pageSize : 10, //每条页数
tableSize:'', //总数
props:{
row:Object
},
jobName : "",
JobData : [],
tableTitle:[ {
type:'expand',
width:50,
render:function(h,params){
var functionList = [];
var p =h('a', {
on : {
click : function() {
vm.view(params.row);
}
}
}, params.row.JOBNAME);
functionList.push(p);
return h('div', functionList);
}
}]
效果:
例子3、
data : {
content : '',
pageNo : '', //当前页码
pageSize : 10, //每条页数
tableSize:'', //总数
props:{
row:Object
},
jobName : "",
JobData : [],
tableTitle:[ {
type:'expand',
width:50,
render:function(h,params){
var o = '';
$.ajax({
url:"../job/selectzJ",
type:"post",
async:false,
data:{'zdFlag':params.row.DBID},
success: function(result) {
if (result.msg == -9){
o = params.row.DBID;
}else{
o = result.msg;
}
}
})
return h('div', o);
}
}]
效果:
从以上3个例子中可以看出
render:function(h,params){}方法中
h是一个函数,用处在于回调一个数值来显示,而params代表着这行数据中的参数的值
更多推荐
已为社区贡献1条内容
所有评论(0)