如何使复选框的文本也切换答案

【问题标题】：How to make text of checkbox toggle as well如何使复选框的文本也切换
【发布时间】：2021-08-17 03:59:42
【问题描述】：

我有复选框和文本“点击我”。我没有为复选框使用任何外部库。

<TouchableOpacity
          onPress={onPress}
      >
        {isSelected && (
            <Icon
                color={Colors.darkPurple}
            />
        )}
      </TouchableOpacity>

并将这个组件导入另一个添加文本的组件（我的意思是复选框的标题）

        <View>
              <CheckBox
                style={styles.checkBox}
                touchableProps={{ onPress: this.toggle }}
              />
              <Text>click me</Text>
            </View>

问题是唯一的复选框图标是可点击的。我需要使复选框的标题也可以点击。

反应原生。

【问题讨论】：

将<CheckBox> 组件包装在<label> 元素中？

标签： javascript reactjs react-native checkbox

【解决方案1】：

您应该将标题作为 Checkbox 组件本身的一部分。例如，您可以将标题作为子项传递：

<Checkbox>
  click me
</Checkbox>

在您的组件定义中，将 Text 放在 TouchableOpacity 中：

<TouchableOpacity>
  <Icon />
  <Text>{this.props.children}</Text>
</TouchableOpacity>

为了切入主题，省略了上面代码的某些部分。

【讨论】：