【Vue-Element UI】Element UI做表格和分页器，前后端展示列表数据

目录

静态组件界面 

 1、表格（Table）

2、分页器 （Pagination）

 3、展示列表数据

4、接口统一暴露

静态组件界面 

表格和分页器外观图：

 首先利用ElementUI搭建静态组件界面

Element - The world's most popular Vue UI framework

 1、表格（Table）

<el-table style="width: 100%" border :data="list">
      <el-table-column type="index"  label="序号" width="80px" align="center"> </el-table-column>
      <el-table-column prop="tmName" label="品牌名称" width="" align="center"> </el-table-column>
      <el-table-column prop="logoUrl" label="品牌logo" width="" align="center"> 
        <template slot-scope="{row,$index}">
             <img :src="row.logoUrl" alt="" style="width:100px;heigth:100px">
        </template>
      </el-table-column>
      <el-table-column prop="" label="操作" width="" align="center"> 
        <template slot-scope="{row,$ind