关于element-ui:elementUI小功能合集

前言

本文章次要更新elementUI应用过程中一些小需要的实现，遇到问题就会更新，欢送大家探讨交换

一、elementui中el-table-column里显示两个后盾字段

需要：<el-table-column></el-table-column>要展现的数据来自后盾返回的两个字段
代码如下：

<el-table-column prop="specs,quantityUnit" label="规格">
      <template slot-scope="scope"> 
            {{scope.row.specs}}/{{scope.row.quantityUnit}} 
       </template>
 </el-table-column>

二、vue+elementui设置表格分页

需要：elementUI的表格可能分页，联合el-pagination应用
步骤：
    1.拿到后端传回的数据数组
    2.在data内定义页数、每页多少条数据这两个变量
    3.在el-table的data属性中通过slice函数宰割数据
    4.依据官网的分页办法实现切换数据的成果
代码如下： 

//在data中注册应用的数据
data:function(){ 
    return { 
    total:0,//默认数据总数(也可由数据数组长度) 
    pagesize:7,//每页的数据条数 
    currentPage:1,//默认开始页面 } }
//将数据绑定到el-table上
<el-table :data="searchInfo.slice((currentPage-1)*pagesize,currentPage*pagesize)">

三、vue+element实现动静表格：依据后盾返回的属性名和字段动静生成可变表格

需要：