Vue2版本
<template>
<div>
<el-table :data="list" style="width: 100%">
<el-table-column v-for="(item) in columns" :prop="item.key" :label="item.title" width="180" :key="item.key">
<template slot-scope="scope">
<span v-if="item.key == 'name'">{{scope.row.name}}</span>
<span v-else>{{scope.row[item.key]}}</span>
</template>
</el-table-column>
</el-table>
</div>
</template>
Vue3版本
<template>
<div>
<el-table :data="list" style="width: 100%">
<el-table-column v-for="(item) in columns" :prop="item.key" :label="item.title" :key="item.key">
<template #default="scope">
<span v-if="item.key == 'name'">{{scope.row.name }}</span>
<span v-else>{{scope.row[item.key]}}</span>
</template>
</el-table-column>
</el-table>
</div>
</template>
今晚刚好学习Vue3发现插槽不能使用vue2的写法,否则会报错！
vue必须在template标签中声明，且slot-scope用#xxx 代替
