我正在学习 React Native,我正在尝试使用复选框。我们从 React Native 导入的普通复选框。即从react-native导入{checkbox}对我有用。但是当我尝试使用react-native-elements 中的复选框时,它不起作用。它只为未选中的图标设置默认值,并且不会更改。
<View style = {styles.containerForCheckBoxValues}>
<CheckBox
style={styles.checkBox}
checkedIcon={<Image source={require('/root/VS_Code/JavascriptProjects/assets/Images/Checkboxactive/Checkboxactive.png')} />}
uncheckedIcon={<Image source={require('/root/VS_Code/JavascriptProjects/assets/Images/Checkboxdefault/Checkboxdefault.png')} />}
value={this.state.checkedForKids}
onChange={() => this.onChangeCheckForKids()} />
<Text style={styles.textViewStyleKidsStatusLabel}>Have Kids</Text>
</View>;
最佳答案
在react-native-elements上,你有一个属性checked
,它必须在true
或false
之间改变,这就是定义它是否被检查的原因或不。要进行更改,您可以调用函数onPress
。
<CheckBox
style={styles.checkBox}
checkedIcon={<Image source={require('/root/VS_Code/JavascriptProjects/assets/Images/Checkboxactive/Checkboxactive.png')} />}
uncheckedIcon={<Image source={require('/root/VS_Code/JavascriptProjects/assets/Images/Checkboxdefault/Checkboxdefault.png')} />}
checked={this.state.checkedForKids}
title='Your title'
onPress={() => this.onChangeCheckForKids()}
对于多个复选框,我的做法是使用数组。如果您知道将有多少个复选框,那么这很容易,每个复选框只需“属性”一个数字,例如复选框 1 将位于数组中的位置 0。
如果你不知道你有多少个,我会为你的对象设置一个额外的键。
看起来像这样:
let x = [{
title: 'this is your title',
id: 1,
checked:true,
}{
title: 'this is your second title',
id: 2,
checked:false,
}];
完整的简单工作示例:
<CheckBox
title={'click here'}
checked={this.state.delivery}
onPress={() => this.setState({ delivery: !this.state.delivery })}/>
关于react-native - React Native 检查取消选中不适用于自定义图标,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54924249/