SOURCE

const CusTable = {
    props: ['columns', 'data'],
    template: `
        <a-table :columns="columns" :data-source="data" :rowClassName="rowclass">
            <div slot="index" slot-scope="text, record, index">
              {{ ( 1 - 1) * 10 + index }}
            </div>
            <a slot="name" slot-scope="text">{{ text }}</a>
            <span slot="customTitle"><a-icon type="smile-o" /> Name</span>
            <span slot="tags" slot-scope="tags">
            <a-tag
                v-for="tag in tags"
                :key="tag"
                :color="tag === 'loser' ? 'volcano' : tag.length > 5 ? 'geekblue' : 'green'"
            >
                {{ tag.toUpperCase() }}
            </a-tag>
            </span>
            <span slot="action" slot-scope="text, record">
            <a>Invite 一 {{ record.name }}</a>
            <a-divider type="vertical" />
            <a>Delete</a>
            <a-divider type="vertical" />
            <a class="ant-dropdown-link"> More actions <a-icon type="down" /> </a>
            </span>
        </a-table>
    `
}

Vue.component('cus-table', CusTable)


const columns = [
    {
        title: '序号',
        scopedSlots: { customRender: 'index' },
    },
    {
        dataIndex: 'name',
        key: 'name',
        slots: { title: 'customTitle' },
        scopedSlots: { customRender: 'name' },
    },
    {
        title: 'Age',
        dataIndex: 'age',
        key: 'age',
    },
    {
        title: 'Address',
        dataIndex: 'address',
        key: 'address',
    },
    {
        title: 'Tags',
        key: 'tags',
        dataIndex: 'tags',
        scopedSlots: { customRender: 'tags' },
    },
    {
        title: 'Action',
        key: 'action',
        scopedSlots: { customRender: 'action' },
    },
];

const data = [
    {
        key: '1',
        name: 'John Brown',
        age: 32,
        address: 'New York No. 1 Lake Park',
        tags: ['nice', 'developer'],
    },
    {
        key: '2',
        name: 'Jim Green',
        age: 42,
        address: 'London No. 1 Lake Park',
        tags: ['loser'],
    },
    {
        key: '3',
        name: 'Joe Black',
        age: 32,
        address: 'Sidney No. 1 Lake Park',
        tags: ['cool', 'teacher'],
    },
];

const rowclass = (record, index) => index%2===0?"purple-row":""

new Vue({
    data() {
        return {
            columns,
            data
        }
    },
    methods: {
        rowclass
    }
}).$mount('#app')

<div id="app">
	<cus-table :columns="columns" :data="data"></cus-table>
</div>

.purple-row {
    background-color: rgb(227, 213, 249);
}