效果如图
有时候会遇到一个格子里面需要放入多个字段的情况并且还要判断类型不同显示的内容不同的情况,代码如下:
<span slot="actions" slot-scope="text" class="table-btn-box">
<template id="payTypes">
<ul>
<li v-show="text.payType == '银行卡'">持卡人姓名 : {{text.cardholderName}}</li>
<li v-show="text.payType == '银行卡'">银行卡类型 : {{text.typeName}}</li>
<li v-show="text.payType == '银行卡'">银行卡号 : {{text.account}}</li>
<li v-show="text.payType == '支付宝'">支付宝昵称 : {{text.typeName}}</li>
<li v-show="text.payType == '支付宝'">支付宝账号 : {{text.account}}</li>
</ul>
</template>
</span>
{
title: '提现账号',
key: 'operations',
scopedSlots: { customRender: 'actions'},
width:260,
align: 'center'
},
他的主要原理就是用插销的方式直接插到表格里面,然后通过条件来判断是否显示