当复选框(this.state.check
)的状态为true
时,列表视图内的复选框被选中,但在onItemSelect()
方法中状态发生变化时,它不被选中。
我想更改模式列表视图中复选框的状态,并根据状态更改立即采取行动。
这是我的代码
export default class Create extends Component {
constructor(props) {
super(props);
this.state = {
check:false
}
}
onItemSelect(row, data){
let tmp = this.state.selectedItems;
let tmpItem = this.state.selectedData;
if(tmp.includes(row)){
tmp.splice(tmp.indexOf(row), 1);
tmpItem.splice(tmpItem.indexOf(data), 1);
this.setState({check:false});
} else {
this.setState({check:true});
tmp.push(row);
tmpItem.push(data);
}
}
render(){
return(
<Modal visible={this.state.isModalVisible}
style={{margin:20,borderRadius:5,width:width/1.3,height:height/2}}>
<View style={{right:0}}>
<ListView
enableEmptySections={true}
dataSource={this.state.dataSource}
renderRow={(dataItem, sectionID, rowID) => {
return(
<View >
<List style={{backgroundColor:'#fff'}}>
<ListItem >
<Body style={{}}>
<Grid>
<Row>
<Col size={90}></Col>
<Col size={10}>
<TouchableOpacity>
<CheckBox color={'black'}
isChecked={this.state.selectedItems.includes(rowID) ? true : false}
onClick={() => this.onItemSelect(rowID,dataItem)}
/>
</TouchableOpacity>
</Col>
</Row>
</Grid>
</Body>
</ListItem>
</List>
</View>
)
}}
/>
</View>
</Modal>
)}
}