zoukankan      html  css  js  c++  java
  • 上下移动顺序

    上移:moveUp
    下移:moveDown

              <el-table ref="multipleTable" :height="operaHeight" :data="listTableData" style=" 100%" @selection-change="handleSelectionChange">
                <el-table-column type="selection" width="55"></el-table-column>
                <el-table-column prop="name" label="操作名称" min-width="30%">
                  <template slot-scope="scope">
                    <span @click="btnActionDataClick(scope.row)">{{ scope.row.name }}</span>
                  </template>
                </el-table-column>
                <el-table-column prop="name" label="操作类型" min-width="30%"></el-table-column>
                <el-table-column prop="address" label="向上移动">
                  <template slot-scope="scope">
                    <el-button size="mini" :disabled="scope.$index === 0" @click="moveUp(scope.$index, scope.row)">
                      <i class="el-icon-arrow-up"></i>
                    </el-button>
                  </template>
                </el-table-column>
                <el-table-column prop="address" label="向下移动">
                  <template slot-scope="scope">
                    <el-button size="mini" :disabled="scope.$index === listTableData.length - 1" @click="moveDown(scope.$index, scope.row)">
                      <i class="el-icon-arrow-down"></i>
                    </el-button>
                  </template>
                </el-table-column>
              </el-table>
    
    
    data(){
          return{
                listTableData:[]
          }
    },
    
    methods:{
        /**
         * 操作向上移动
         */
        moveUpmoveUp(index) {
          console.log(this.listTableData);
          // 保存上一条数据
          let updata = this.listTableData[index - 1];
          // 删除上一条的数据
          this.listTableData.splice(index - 1, 1);
          // 将上一条数据插入当前的索引数组
          this.listTableData.splice(index, 0, updata);
        },
    
        /**
         * 操作向下移动
         */
        moveDown(index) {
          // 保存下一条数据
          let downData = this.listTableData[index + 1];
          // 删除下一条数据
          this.listTableData.splice(index + 1, 1);
          // 将下一条数据插入当前的索引中
          this.listTableData.splice(index, 0, downData);
        },
    }
    
  • 相关阅读:
    工作笔记总结——数据库
    PHP 的本地文件缓存处理类(非常高效)
    word如何去掉背景色
    安装CORBA产品visibroker注意问题
    [Python小菜]Bulidin Function Type使用小记
    java正则表达式和网页爬虫的制作
    工作笔记总结——前台js和jQuery
    thinkphp+ajax 实现点击加载更多数据
    第三方微信登录
    substring() 方法用于提取字符串中介于两个指定下标之间的字符。
  • 原文地址:https://www.cnblogs.com/yx1102/p/13658775.html
Copyright © 2011-2022 走看看