elementUI種的多選框和單選框差不多,
(1)el-checkbox-group里綁定一個數組
(2)el-checkbox-group綁定一個方法獲取值
(3)for循環選項,綁定key,label
(4)el-checkbox里還可以綁定disabled和checked
例子:
<template> <div> <el-checkbox-group v-model="test" @change="getValue()"> <el-checkbox v-for="(item,i) in items" :key="i" :label="item.content" :disabled="item.disabled" :checked="item.checked"></el-checkbox> </el-checkbox-group> </div> </template> <script> export default { name: "HelloWorld", data() { return { test:[], // 默認選項,要在el-checkbox-group里綁定一個空數組 items:[ {id:0,content:"選項一",disabled:false,checked:true}, {id:1,content:"選項二",disabled:true,checked:false}, {id:2,content:"選項三",disabled:false,checked:false}, ] }; }, methods: { getValue(){ console.log(this.test) } }, }; </script> <style lang="css" scoped> </style>