element的el-table-column循环渲染和自定义列

直接上代码了

// 自定义组件
<template>
	<div class="x__table>
		<el-table
			v-loading="tableLoading"
			:data="tableData"
			border
			stripe>
			<el-table-column
				v-if="index"
		        type="index"
		        label="序号"
		        align="center"
		        width="50">
				<template slot-scope="scope">
					<span>{
   {
    scope.$index + (page.current - 1) * page.size + 1 }}</span>
				</template>
			</el-table-column>
			<template v-for="(item, index) in tableOption">
		    	<el-table-column
		        	:key="index"
					:prop="item.prop"
					:label="item.label"
					:align="item.align || 'center'"
					:show-overflow-tooltip="item.overHidden || true">
					<template slot-scope="scope">
						// 这里通过插槽实现自定义列
			            <slot
			            	v-if="item.slot"
			            	:name="scope.column.property"
			            	:row="scope.row"
			            	:$index="scope.$index"