zoukankan      html  css  js  c++  java
  • vue element table

    elementui+vuejs如何添加表格操作按钮

     

    <el-table :data="tableData" stripe border style="100%" highlight-current-row>
      <el-table-column type="selection" width="55">
      </el-table-column>
      <el-table-column prop="phone" label="手机号" align="center" min-width="120">
      </el-table-column>
      <el-table-column prop="nickname" label="昵称" align="center" min-width="100">
      </el-table-column>
      <el-table-column prop="createTime" label="注册时间" align="center" min-width="120">
      </el-table-column>
      <el-table-column prop="enableState" label="用户状态" align="center" min-width="100">
      </el-table-column>
      <el-table-column prop="tradeState" label="交易状态" align="center" min-width="100">
      </el-table-column>
      <el-table-column label="操作" align="center" min-width="100">
        <template slot-scope="scope">
          <el-button type="text" @click="checkDetail(scope.row.phone)">查看详情</el-button>
          <el-button type="info" @click="modifyUser(scope.row.phone)">修改</el-button>
          <el-button type="info" @click="deleteUser(scope.row.phone)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>

    //删除用户
    deleteUser(val){
      console.log(val)

    //这里写相应的逻辑,val是指传进来的参数也就是上面的scope.row.phone;也可以是scope.row.nickname等
    },
    //修改用户
    modifyUser(val){
      let self = this;
    },
    //查看详情
    checkDetail(val){
      console.log(val)
    }

  • 相关阅读:
    Centos7更改网卡名为eth0
    Centos7部署Open-Falcon监控
    centos6.x一键15项系统优化(转自努力哥)
    运维题目(十三)
    运维题目(十二)
    Mongodb的学习整理(下)
    Centos7下yum安装mongodb
    浏览器缓存
    控制反转
    js setTimeOut()
  • 原文地址:https://www.cnblogs.com/xiaoer-heidou/p/9067608.html
Copyright © 2011-2022 走看看