vue2 jsx 渲染函数
render: (h, params) => this.$createElement('div', {
ref: 'child',
}, 1111),
ref 不生效使用$createElement
https://codeantenna.com/a/OLcBUtdszJ
render: (h, params) => {
return [
<el-select
filterable
clearable
v-model={params.row.feeTypeId}
onchange={() => {
this.feeTypeChange(
this.info.salecontractInvoiceList,
params.row.feeTypeId,
params.index
);
}}
>
{this.feeTypeList.map((item) => {
return (
<el-option
key={item.id}
label={item.name}
value={item.id}
></el-option>
);
})}
</el-select>,
];
},
render: (h, params) => {
return [
<el-input-number
controls-position="right"
step={1}
min={1}
max={99}
controls={false}
step-strictly
v-model={params.row.qty}
onchange={() => {
this.qtyChange(params.row, params.row.qty, params.index);
}}
/>,
];
},
render: (h, params) => {
return h(
"el-button",
{
props: {
type: "text",
},
on: {
click: () => {
this.deleteRow(
this.info.salecontractInvoiceList,
params.index
);
},
},
},
[h("i", { class: "el-icon-delete delete" }, "")]
);
},
render: (h, params) => {
let userMessage;
if (this.type != "order") {
userMessage = (
<el-button
type="text"
title="大票拆分"
icon="iconfont icondapiaochaifen"
class="icondapiaochaifen-btn"
onclick={() => {
this.batchInvoice(params.index, params.row);
}}
>
</el-button>
);
} else {
userMessage = null;
}
return [
<div>
{userMessage}
<el-button
type="text"
class="red"
icon="el-icon-delete"
onclick={() => {
this.deleteRow(params.index, params.row);
}}
>
</el-button>
</div>,
];
},
指令
render: (h, params) => {
return [
<el-button
type="text"
v-auth="/CRM/项目订单/意向项目/新建编辑"
onclick={() => {
this.edit(params.row.id);
}}
>
编辑
</el-button>,
];
},
render: (h, params) => {
return [
<el-button
type="text"
v-detail={{
auth: "/财务/发票管理/详情",
value: params.row.invoiceCode,
}}
onClick={() => {
this.toDetail(params.row.invoiceId);
}}
>
{params.row.invoiceCode}
</el-button>,
];
},
过滤器
render: (h, params) => {
return h("span", {}, [
this.$options.filters.currency(params.row.totalAmount, 2),
]);
},
render: (h, params) => {
return [
<span>
{this.$options.filters.timeFmt(
params.row.submitTime,
"yyyy-MM-dd"
)}
</span>,
];
},
render: (h, params) => {
let btnArray = Object.entries(params.row.taskMap);
if (btnArray.length > 0) {
return [
this.buttonArray.map((item) => {
for (let i = 0; i < btnArray.length; i++) {
if (btnArray[i][1] === item.label&&this.authRequest(item.auth)) {
item.taskKey = btnArray[i][0];
return (
<el-button
type="text"
key={item.value}
disabled={
params.row.invoicecombineStateName === "已作废"
}
onClick={() => {
this.handleclick(params.row, item);
}}
>
{item.label}
</el-button>
);
}
}
}),
];
}
},
render: (h, params) => {
return [
<el-radio-group v-model={params.row.retrieve}>
{this.typeOptions.map((item) => {
return [
<el-radio
key={item.value}
label={item.value}
disabled={this.isDisable(
params.row.lockState,
item.value
)}
>
{item.label}
</el-radio>,
];
})}
</el-radio-group>,
];
},
render: (h, params) => {
return [
<span>
{" "}
{this.$options.filters.currency(params.row.totalAmount, 2)}{" "}
</span>,
];
},
render: (h, params) => {
if (params.row && params.row.changeType !== 1) {
return h(
"span",
{
props: {
level: 1,
value: this.value,
},
attrs: {
class: "add",
},
on: {},
},
"追加"
);
}
return h(
"span",
{
props: {
level: 1,
value: this.value,
},
attrs: {
class: "delete",
},
on: {},
},
"删除"
);
},
render: (h, params) => {
if (Array.isArray(params.row.attachBusinessRelations)) {
return (
<div>
{params.row.attachBusinessRelations.map((item) => {
return (
<div title={item.fileName}>
<el-button
class="ellipsis"
type="text"
onclick={() => {
download(item.attachId);
}}
>
{item.fileName}
</el-button>
</div>
);
})}
</div>
);
}
},
render: (h, params) => {
return (
<Upload
data={this.linkfile}
{...{ on: { "update:data": (val) => (this.linkfile = val) } }}
/>
);
},
render: (h, params) => {
let userMessage;
if (
params.row.reserveProjectState === 0 ||
params.row.reserveProjectState === null
) {
userMessage = (
<el-button type="text"
disabled={params.row.projectStatus === 1?true:false}
icon="el-icon-star-off"></el-button>
);
} else if (params.row.reserveProjectState === 1) {
userMessage = (
<el-button
type="text"
disabled={params.row.projectStatus === 1?true:false}
icon="el-icon-star-on orange"
></el-button>
);
} else if (params.row.reserveProjectState === 2) {
userMessage = (
<el-button type="text"
disabled={params.row.projectStatus === 1?true:false}
icon="el-icon-star-on gray"></el-button>
);
}
return (
<div
onclick={() => {
params.row.projectStatus === 1 ?null:this.changeProjectState(params.row);
}}
>
{userMessage}
</div>
);
},
render: (h, params) => {
let array = this.handlelist(params.row.linkmanPhoneItemList, 1);
return (
<div>
{array.map((item, index) => {
return [
<span>
{index !== 0 ? "," : ""}
<span class={item.mainPhone == 1 ? "orange" : ""}>
{item.phoneNumber.trim()}
</span>
</span>,
];
})}
</div>
);
},