taro ui 勾选框
时间: 2023-10-30 13:02:00 浏览: 239
Taro UI提供了一个AtCheckbox组件,但根据引用中提到的内容,它并不适合在数组循环中使用。相反,Taro原生的代码已经提供了一个多选框组件,并且样式更好看。在使用Taro原生的多选框组件时,需要注意以下几点:
1. 首先,需要导入Checkbox组件和其他必要的组件,例如View和Text。这可以通过以下代码实现:`import { View, Text, Checkbox } from '@tarojs/components'`。
2. 其次,为了获取所选中的一组数组,我们需要使用CheckboxGroup组件。将循环的数组包裹在CheckboxGroup组件的外面。这是官方文档推荐的做法。
3. 第三点是,Taro不识别官方文档中推荐的bindchange事件,而是使用onChange事件。所以在使用多选框时,需要将onChange事件与Checkbox组件绑定。
4. 需要注意的是,Checkbox组件的checked属性只代表初始选中状态,页面点击选中与非选中不会改变checked的true/false值。
5. 最后,如果将数组对象放在value属性里面不做任何处理,通过onChange事件获取到的e.detail.value将只是字符串数组,例如`["[object Object]", "[object Object]"]`。如果想要获取选中的数组对象,需要提前使用`JSON.stringify(item)`将它们转为字符串,然后再使用`JSON.parse(e.detail.value)`将字符串转回对象。
综上所述,根据引用中提到的内容,Taro原生的多选框组件是一个更好的选择。你可以按照上述步骤使用Taro原生的多选框组件来实现勾选框的功能。
阅读全文