vue antd项目实战——checkbox多选框限制选择个数(disable属性与includes方法)

时间:2025-01-19 17:05:32
<a-checkbox-group v-model:value="formState.certificates_seal_select" name="sealcheckboxGroup" style="margin-top:6px" > <a-checkbox value="fmins_work-js" :disabled="( formState.certificates_seal_select.length < (formState.honor_type == 1 ? 2 : 3) || formState.certificates_seal_select.includes('fmins_work-js') == true ) ? false : true" >五分钟讲堂工作室公章&emsp; </a-checkbox> <a-checkbox value="fmins_trail" :disabled="( formState.certificates_seal_select.length < (formState.honor_type == 1 ? 2 : 3) || formState.certificates_seal_select.includes('fmins_trail') == true ) ? false : true" >五分钟讲堂培训专用章 </a-checkbox> <a-checkbox value="multiple_manager" :disabled="( formState.certificates_seal_select.length < (formState.honor_type == 1 ? 2 : 3) || formState.certificates_seal_select.includes('multiple_manager') == true ) ? false : true" >综合管理部公章 </a-checkbox> <a-checkbox value="ued" :disabled="( formState.certificates_seal_select.length < (formState.honor_type == 1 ? 2 : 3) || formState.certificates_seal_select.includes('ued') == true ) ? false : true" >产品与UED部公章 </a-checkbox> <br/> <div style="height:5px"> </div> <a-checkbox value="duoduoywh_department" :disabled="( formState.certificates_seal_select.length < (formState.honor_type == 1 ? 2 : 3) || formState.certificates_seal_select.includes('duoduoywh_department') == true ) ? false : true" >多多的宇文化工作室公章 </a-checkbox> <a-checkbox value="dev_and_test" :disabled="( formState.certificates_seal_select.length < (formState.honor_type == 1 ? 2 : 3) || formState.certificates_seal_select.includes('dev_and_test') == true ) ? false : true" >技术研发与测试部公章 </a-checkbox> <a-checkbox value="school_and_media" :disabled="( formState.certificates_seal_select.length < (formState.honor_type == 1 ? 2 : 3) || formState.certificates_seal_select.includes('school_and_media') == true ) ? false : true" >校园媒体部公章 </a-checkbox> <a-checkbox value="learing_and_teaching" :disabled="( formState.certificates_seal_select.length < (formState.honor_type == 1 ? 2 : 3) || formState.certificates_seal_select.includes('learning_and_teaching') == true ) ? false : true" >学科教研部公章 </a-checkbox> </a-checkbox-group>