【Vue.js】Element-UI中根据后台返还的值决定选用什么标签（<template slot-scope="scope">）

场景：当我成功添加一个收藏网址的时候，根据我预先定义好的类别，根据返回的prop值显示不同的图标，像下边这样

从后台返还的数据中的__v判断，若其为0，选择标签【学习】，1则是【工具】。

如何根据prop的值来判断 ，在element-UI中怎么判断，将prop去掉在下面加上里面再写vue的判断

可是在HTML里哪有函数判断的说法
利用Vue操作DOM节点也不是什么很好的办法

我们不使用prop返回的值进行判断，我们使用<template slot-scope="scope">
得到标签对应的值后利用v-if和v-else-if指令进行判断
通过条件判断展示或者隐藏某个元素或者多个元素（这里元素指代tag）

       <el-table :data="tables.slice((currentPage-1)*pagesize,currentPage*pagesize)"  stripe=true >
         <el-table-column prop="date" label="日期" width="100">

         </el-table-column>
         <el-table-column  label="类别" width="80">
        <template slot-scope="scope">//这里取到当前单元格
        //scope.row 直接取到该单元格对象，即是tableData[scope.$index]
        //.__v是对象里面的__v属性的值
            <el-tag v-if="scope.row.__v===0" >学习</el-tag>
            <el-tag  v-else-if="scope.row.__v===1" type="success">工具</el-tag>
            <el-tag  v-else-if="scope.row.__v===2" type="info">生活</el-tag>
            <el-tag  v-else-if="scope.row.__v===3" type="warning">前端</el-tag>
            <el-tag  v-else-if="scope.row.__v===4" type="danger">其他</el-tag>


        </template>
         </el-table-column>

在el-table中，:data="tables.slice((currentPage-1)*pagesize,currentPage*pagesize)"这里是经过处理的数据集，这里大可不必过于追究，简简单单看成是静态数据集tableData就好

作用域插槽，是为了从父组件中，通过使用注册的子组件标签，并对其属性slot-scope进行定义，从而使用子组件中绑定的数据。在这里通过slot-scope=“scope”将el-table-column标签中绑定的当前行的数据对象重命名为scope，进而再通过scope.row来获取当前行的数据。

【官方文档】Vue的插槽