vue+element中,依据状况的差别,表格中操纵行按钮的显现隐蔽题目

2019年9月1日 239次阅读 来源: 冬瓜先生

背景治理体系中须要做出以下的功用,依据状况的差别,表格中操纵行按钮显现差别
《vue+element中,依据状况的差别,表格中操纵行按钮的显现隐蔽题目》

《vue+element中,依据状况的差别,表格中操纵行按钮的显现隐蔽题目》

当前行构造以下:

    <el-table-column label="操纵" width="150" class="caozuo">
         <template slot-scope="scope" v-if="scope.row.state != 3">
               <div class="caozuoBtn" v-if="showList1.indexOf(scope.row.state) != -1" @click="assignment(['currentItem', 'dialogUrgentVisible'], [scope.row, true])">催办</div>
               <div class="caozuoBtn" v-if="showList2.indexOf(scope.row.state) != -1" @click="assignment(['currentItem', 'dialogAzVisible'], [scope.row, true])">转装置单</div>
              <div class="caozuoBtn" v-if="showList3.indexOf(scope.row.state) != -1" @click="cdClick(scope.row)">撤单</div>
              <div class="caozuoBtn" v-if="showList4.indexOf(scope.row.state) != -1" @click="assignment(['currentItem', 'dialogZpVisible'], [scope.row, true])">转派</div>
        </template>
    </el-table-column>

data中的数据

      showList1: [0,1],          //  显现按钮1  催办
      showList2: [0,2],          //  显现按钮2  转装置单
      showList3: [0,1,2,5],      //  显现按钮3  撤单
      showList4: [0,1,2,4],      //  显现按钮4  转派
      
      //猎取列表数据,当前行scope.row.state的值在数组showList1存在,就显现当前按钮,
      //当每次点击按钮差别时,就会发送要求时,并把状况发送过去,从而转变按钮的状况
      v-if="showList1.indexOf(scope.row.state) != -1"
    原文作者：冬瓜先生
    原文地址: https://segmentfault.com/a/1190000019408671
    本文转自网络文章，转载此文章仅为分享知识，如有侵权，请联系博主进行删除。
点赞