使用el-table标签的:data属性，可以设置数据源。
el-table-column用来设定 列级
通过slot-scope="scope"我们可以对每一行进行操作，只要把scope传入函数中，即可进行逻辑操作
1 <el-table :data="messages"> 2 <el-table-column label="id"> 3 <template slot-scope="scope"> 4 <span>{{scope.row.id}}</span> 5 </template> 6 </el-table-column> 7 <el-table-column label="学号"> 8 <template slot-scope="scope"> 9 <span>{{scope.row.studentId}}</span> 10 </template> 11 </el-table-column> 12 <el-table-column label="姓名"> 13 <template slot-scope="scope"> 14 <span>{{scope.row.name}}</span> 15 </template> 16 </el-table-column> 17 <el-table-column label="年龄"> 18 <template slot-scope="scope"> 19 <span>{{scope.row.age}}</span> 20 </template> 21 </el-table-column> 22 <el-table-column label="性别"> 23 <template slot-scope="scope"> 24 <span>{{scope.row.gender}}</span> 25 </template> 26 </el-table-column> 27 <el-table-column label="修改"> 28 <template slot-scope="scope"> 29 <el-button type="primary" icon="el-icon-edit" circle @click="editMessage(scope)"/> 30 </template> 31 </el-table-column> 32 <el-table-column label="删除"> 33 <template slot-scope="scope"> 34 <el-button type="danger" icon="el-icon-delete" circle @click="delMessage(scope)"/> 35 </template> 36 </el-table-column> 37 </el-table>