今天,请假去打了疫苗。回到家,同事发给我一个问题,说elementUI的复选框,点选不了。我以为是数据的原因,自己在电脑上试了下。 发现给 checkedCities 赋; 字符串、数字 。都可以选中呀,后来在网上找了下,发现如下情况,会导致 elementUI的复选框,点选不了。
情况
产生的原因
- checkedCities 默认值是 []
- min 值大于等于2 选中不了的效果图展示
将图片在新窗口打开,查看完整的效果。
问题复现的代码 以下代码在浏览器中打开,就会出现'复选框选不中'的问题
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">
<title>测试Element</title>
</head>
<body>
<div id="app">
<el-checkbox-group v-model="checkedCities" :min="2">
<el-checkbox label="1" name="type">美食</el-checkbox>
<el-checkbox label="2" name="type">地推活动</el-checkbox>
<el-checkbox label="3" name="type">线下主题活动</el-checkbox>
</el-checkbox-group>
</div>
</body>
<!-- import Vue before Element -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- import JavaScript -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<!-- -->
<script>
new Vue({
el: '#app',
data: function () {
return {
checkedCities:[],
}
},
})
</script>
</html>