Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
640 views
in Technique[技术] by (71.8m points)

element-ui el-checkbox 如何获取当前选中行的数据

<el-checkbox-group v-model="checkAll" @change="handleCheckChange">
    <el-checkbox
        v-for="(item, index) in list"
        :label="item"
     >{{item.label}}</el-checkbox>
</el-checkbox-group>





export default {
    data(){
        return {
            checkAll: [],
            list:[
                {
                    id: '1',
                    label: 'test1'
                },
                {
                    id: '2',
                    label: 'test2'
                },
                {
                    id: '3',
                    label: 'test3'
                }
            ]
        }
    },
    methods: {
        handleCheckChange(val) {
            console.log(val)
        }
    }
}

如代码所示,我点击多选框勾选的时候,只能获取已经选中的多条数据,怎样做才能同时获取到我当前点击的一条数据呢?


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

https://codepen.io/ciaozz/pen...

<el-checkbox-group v-model="checkAll" @change="handleCheckChange">
    <el-checkbox @change="test(item)" v-for="(item, index) in list" :label="item">
        {{item.label}}
    </el-checkbox>
</el-checkbox-group>

直接在change事件中把item作为参数传进去,然后在函数中就能获取了

test(myVal) {
      console.log(myVal);
    }

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...