element-plus中表格sort-method用法

在表格的使用过程中,一般对一些数据需要进行排序,以达到直观的目的。element-plus表格排序是通过属性sort-method 或者 sort-by来完成的。具体用法:我想对图片中的销量进行一个升序和降序的排列

element-plus中表格sort-method用法_第1张图片
代码:

<el-table
    :data="tableData"
    :border="true"
    style="width: 100%"
  >
    <el-table-column prop="name" label="名称" width="100"/>
    <el-table-column prop="image" label="图片" width="180" />
    <el-table-column prop="inputtime" label="进货时间" width="100"/>
    <el-table-column prop="inputnumber" label="进货数量" sortable
    :sort-method="sortInput" width="130" />
    <el-table-column prop="buffer" label="库存" sortable
    :sort-method="sortBuffer" width="100"/>
    <el-table-column prop="price" label="价格" width="100"/>
    //销量
    <el-table-column prop="sales" label="销量" sortable
    :sort-method="sortSales" width="100"/>
    <el-table-column prop="notes" label="备注"/>
  </el-table>

(1)sortable为TRUE

<el-table-column prop="sales" label="销量" sortable
    :sort-method="sortSales" width="100"/>

(2)

// 销量的排序
const sortSales = (a, b) => (a.sales - b.sales);

你可能感兴趣的:(vue.js,前端,javascript)