码迷,mamicode.com
首页 > 其他好文 > 详细

element表格实现复选框单选记录

时间:2021-02-01 12:16:21      阅读:0      评论:0      收藏:0      [点我收藏+]

标签:mic   loading   row   led   记录   sel   method   length   http   

技术图片

 

默认表格前面的复选框是可以选择多个,但有的需求是只能选择一个,

可以通过clearSelection和toggleRowSelection去实现,把当前选中的这条selected设置成true。

     <div class="same-table">
           <el-table
               :data="tableData"
               class="oneTabel"
               ref="multipleTable"
               border
               fit
               @selection-change="handleSelectionChange"
               @select-all="dialogCheck"
               @select="dialogCheck"
               style="width:100%;">
                   <el-table-column type="selection" width="50"></el-table-column>
                   <el-table-column type="index" width="60" label="序号"></el-table-column>
                   <el-table-column prop="name" label="机构"></el-table-column>
                   <el-table-column prop="negativeDec" label="负面清单描述"></el-table-column>
           </el-table>
       </div>

  

methods: {
       handleSelectionChange(val) {
            console.log(val, ‘val‘)
            this.multipleSelection = val;
        },
        dialogCheck: function(selection, row) {
            console.log(selection, row);
            this.$refs.multipleTable.clearSelection()
            if (selection.length === 0) { 
                return
            }
            if (row) {
                this.selectioned = row
                this.$refs.multipleTable.toggleRowSelection(row, true)
            }
        }
}

  

element表格实现复选框单选记录

标签:mic   loading   row   led   记录   sel   method   length   http   

原文地址:https://www.cnblogs.com/theblogs/p/14350375.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!