我正在制作一个应用程序来训练我的技能,其中显示了一些在我最喜欢的球队中创造了历史的球员。我很麻烦,因为当我按下按钮时无法切换到其他玩家,第一个总是出现,但是我不能让其他玩家按顺序出现,这是代码:
constructor(props){
super(props);
this.state = {
img: require('./src/bkn-lgo.png'),
titles: '--',
points: '--',
assist: '--',
reb: '--'
}
this.switchPlayer = this.switchPlayer.bind(this);
this.players = [
{
name : 'Buck Wiliams',
photo : require('./src/buck.jpg'),
points : 23.8,
assists : 1.3,
rebound : 10.0
},
{
name : 'Drazen Petrovic',
photo : require('./src/drazen.jpg'),
points : 15.4,
assists : 2.4,
rebound : 2.3
},
{
name : 'Bernard King',
photo : require('./src/bernard.jpg'),
points : 22.5,
assists : 3.3,
rebound : 5.8
},
{
name : 'Jason Kidd',
photo : require('./src/kidd.jpg'),
points : 12.6,
assists : 8.7,
rebound : 6.3
},
{
name : 'Julius Erving',
photo : require('./src/erving.jpg'),
points : 24.2,
assists : 4.2,
rebound : 8.5
}
]
}
switchPlayer(){
this.setState({
img: this.players[0].photo,
titles: 0,
points: this.players[0].points,
assist: this.players[0].assists,
reb: this.players[0].rebound
})
}
render(){
return(
<View style={styles.container}>
<View style={styles.title}>
<Text style={styles.textTitle}>Players who made history in Brooklyn Nets</Text>
</View>
<View style={styles.imagee}>
<Image style={styles.img} source={this.state.img}/>
</View>
<View style={styles.downArea}>
<TouchableOpacity style={styles.button} onPress={this.switchPlayer}>
<Text style={{color: 'white'}}>Anything</Text>
</TouchableOpacity>
</View>
<View style={styles.stats}>
<Text style={styles.textDown}>Title: {this.state.titulos}</Text>
<Text style={styles.textDown}>points: {this.state.points}</Text>
<Text style={styles.textDown}>assists: {this.state.assist}</Text>
<Text style={styles.textDown}>Rebounds: {this.state.reb}</Text>
</View>
</View>
);
}
}
我已经尝试过使用一个函数,如果要进行切换,但是没有成功
答案 0 :(得分:0)
您始终在访问数组中的第一项。
this.players[0].photo
0是第一个项目,1是第二个项目,依此类推。您需要提取它并创建一个变量。您可以在状态下设置此变量。