近期做项目需要使用IView组件库的CheckGroup复选框,通过复选框来选择并返回选择好的数组,然而按照官方文档的方法,无论如何都无法通过@on-change绑定的事件来获取到返回的值。最后发现是官方文档有误~废话不多说,直接上代码。希望对大家有所帮助。
官方版本
<CheckboxGroup v-model="checkAllGroup" @on-change="checkAllGroupChange"> <Checkbox label="香蕉"></Checkbox> <Checkbox label="苹果"></Checkbox> <Checkbox label="西瓜"></Checkbox> </CheckboxGroup> <script> export default { data () { return { checkAllGroup: ['香蕉', '西瓜'] } }, methods: { checkAllGroupChange (data) { console.log(data) //无返回,不报错 } }, } </script>正确版本
<Checkbox-group v-model="checkAllGroup" @on-change="checkAllGroupChange"> <Checkbox label="香蕉"></Checkbox> <Checkbox label="苹果"></Checkbox> <Checkbox label="西瓜"></Checkbox> </Checkbox-group> <script> export default { data () { return { checkAllGroup: ['香蕉', '西瓜'] } }, methods: { checkAllGroupChange (data) { console.log(data) //正确返回选中数组 } }, }官方文档将组件 Checkbox-group 写为 CheckboxGroup 。大家注意~希望对大家有所帮助!
本人菜鸟~请大佬手下留情,多多指点
