zoukankan      html  css  js  c++  java
  • 表格中对每一行进行编辑

    使用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>
    金麟岂是池中物,一遇风云便化龙!
  • 相关阅读:
    安装TeX字体
    【数学】对数的底为什么不能为负数
    算法设计的要求
    Windows HTTP Services
    为什么分母不能为0
    循环小数怎样变分数
    在win7环境下批量修改文件权限
    算法复杂度的极限证明
    深入理解 【有理数】、【无理数】、【虚数】
    kettle连接sqlserver
  • 原文地址:https://www.cnblogs.com/ABKing/p/12443984.html
Copyright © 2011-2022 走看看