先说为啥不显示,因为:iview 3.2.0才开始支持的slot的写法;
iview 3.2.0 以下是不支持的,所以去升级iview;
npm install iview
全部代码如下:
<template>
<div>
<Table border :columns="columns" :data="data" >
<template>
<Poptip slot-scope="{row, index}" slot="action">
<Button type="primary" size="small" style="margin-right: 5px" @click="details(index)">详情</Button>
<Button type="warning" size="small" style="margin-right: 5px" @click="edit(row,index)">编辑</Button>
</Poptip>
</template>
</Table>
</div>
</template>
<script>
export default {
data(){
return {
columns:[
{
title:'序号',
type:"index",
align:'center',
},
{
title:'姓名',
key:'name',
align:'center',
},
{
title:'年龄',
key:'age',
align:'center',
},
{
title:'操作',
key:'',
align:'center',
slot:'action'
}
],
data:[
{name:"小王",age:"18"},
{name:"小李",age:"20"}
]
}
},
methods:{
details(index){
},
edit(index){
}
}
}
</script>