关于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 实现动静表格：依据后盾返回的属性名和字段动静生成可变表格

 需要：