Elementui 表格单元格数据操作

    技术2022-07-11  90

    1、单元格数据操作,适用于filter解决不了的数据操作,下面是几种常用写法,也可以用 Table-column 的属性formatter 

    注意:这几种写法本质上是一样的,都是vue的插槽,v-slot是2.6新增的,代替之前的slot和slot-scope

    第一种写法,利用 slot-scope="scope"

    <el-table-column align="center" label="Windows" min-width="105"> <template slot-scope="scope"> <span>{{ scope.row.put}} | {{ scope.row.clicke }}</span> </template> </el-table-column>

    第二种写法,利用  v-slot="scope"

    <el-table-column align="center" label="Windows" min-width="105"> <template v-slot="scope"> <span>{{ scope.row.put}} | {{ scope.row.clicke }}</span> </template> </el-table-column>

    第三种写法,利用  v-slot="{ row }" 对scope进行解构

    <el-table-column align="center" label="Windows" min-width="105"> <template v-slot="{ row }"> <span>{{ scope.row.put}} | {{ scope.row.clicke }}</span> </template> </el-table-column>

     

    Processed: 0.011, SQL: 9