zoukankan      html  css  js  c++  java
  • element-ui 中 el-table 相关操作

    1、带checkbox  获取所有选择的行。

    this.$refs.multipleTable.selection

    获取选中的单行

    this.$refs.roleTable.store.states.currentRow

    2、点击某行选中复选框

    @row-click="rowClick"
     
    rowClick (row) {
            this.$refs.multipleTable.toggleRowSelection(row)
          }
     
    3、获取当前行序号
    scope.$index
     
    <template slot-scope="scope">
              <el-button size="mini" icon="el-icon-top" @click="moveUp(scope.$index)">上移</el-button>
              <el-button size="mini" icon="el-icon-bottom" @click="moveDown(scope.$index)">下移</el-button>
            </template>
     
    4、表格上移,下移
    moveUp(rowIndex){
          if(rowIndex == 0){
            this.$message({
              message:'顶行无法上移!',
              type:'warning'
            })
          }else{
            let row = this.tableData[rowIndex - 1]
            this.tableData.splice(rowIndex - 1, 1)
            this.tableData.splice(rowIndex,0, row)
          }
        },
        moveDown(rowIndex){
          if ((rowIndex + 1) === this.tableData.length){
            this.$message({
              message:'已经是最后一条,不可下移!',
              type:'warning'
            })
          } else {
            let row = this.tableData[rowIndex + 1]
            this.tableData.splice(rowIndex + 1, 1)
            this.tableData.splice(rowIndex,0, row)
          }
        }
    

      

  • 相关阅读:
    cct,web技术
    cct信息安全
    TFS2010安装与管理
    centos7 opera济览器安装
    Hadoop 的常用组件一览
    Exception in thread "main" java.net.BindException: Address already in use: JVM_Bind
    gcc manual
    5350.support
    meminfo,df,
    WCF
  • 原文地址:https://www.cnblogs.com/ckmouse/p/11732629.html
Copyright © 2011-2022 走看看