[英]React native: How to individually control each onpress() from map() generated components
我是新来的本地人。 我要连续渲染3个下拉列表,具体取决于数组中元素的数量。 因此,如果数组具有3个元素,那么将有3个3下拉列表的行。 但是,当从单个下拉列表调用onpress时,它将影响所有3行的相应元素。 我如何单独控制每一行? 许多解决方案都说使用绑定,但是我尝试的方法没有影响任何东西。 单击以查看渲染的布局,在错误中查找3个元素
render_center_selection(){
return(
this.props.selecteddays_array.map((a, i) => {
return(
<View key={i} style={{ height:40, borderBottomWidth:2, borderBottomColor: '#ededed' }}>{
<View style={{flexDirection:'row'}}>
<ModalDropdown
style={styles.selection}
defaultValue='Venue'
textStyle={{width:200,fontSize:20,textAlign:'center',color: '#7070D8'}}
dropdownStyle={styles.dropdownstyle}
dropdownTextStyle={{width:350,fontSize:20,textAlign:'center',backgroundColor: '#FDD60B',}}
options={this.state.venue_name_array}
onSelect={(index,value)=>{this.onVenueSelect(index,value)}}/>
<ModalDropdown
ref="modal_dayselect"
style={styles.dayselection}
defaultValue='Day'
textStyle={{width:50,fontSize:15,textAlign:'center',color: '#7070D8'}}
dropdownStyle={styles.daydropdownstyle}
dropdownTextStyle={{width:50,fontSize:15,textAlign:'center',backgroundColor: '#FDD60B',color: '#7070D8'}}
options={this.state.day_array}
onSelect={(index,value)=>{this.onDaySelect(index,value)}}/>
<ModalDropdown
ref="modal_hrsselect"
style={styles.dayselection}
defaultValue='HRS'
textStyle={{width:50,fontSize:15,textAlign:'center',color: '#7070D8'}}
dropdownStyle={styles.daydropdownstyle}
dropdownTextStyle={{width:50,fontSize:15,textAlign:'center',backgroundColor: '#FDD60B',color: '#7070D8'}}
options={this.state.hrs_array}
onSelect={(index,value)=>{this.setState({selected_hr:value})}}/>
{(this.state.editstatus)
?<Text>Edit</Text>
:<Text></Text>
}
</View>
}</View>)
})
);
}
您必须将唯一键传递给onSelect方法,然后才能分别控制每一行。 在下面的示例中,您可以看到有两个数组,并且要获取内部数组的数据,我必须传递外部数组的索引以及内部数组的索引。 这也将使其独一无二。
var arr1 = [1,2,3]
var arr2 = ['a','b','c']
function looper(data1,data2){
data1.map((item1,index1) => {
data2.map((item2,index2) =>console.log("item1: " + item1 + " " + index1 + " item2: " + item2 + " " + index2));
})
}
looper(arr2,arr1);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.