React native 按下时更改特定按钮背景(反应本机)
我想做一个简单的测验。我想改变一个按钮的背景绿色,如果它是正确的,红色,如果它是不正确的按。我的问题是如何只选择其中一个按钮?目前我只能让所有的按钮都变成彩色React native 按下时更改特定按钮背景(反应本机),react-native,React Native,我想做一个简单的测验。我想改变一个按钮的背景绿色,如果它是正确的,红色,如果它是不正确的按。我的问题是如何只选择其中一个按钮?目前我只能让所有的按钮都变成彩色 export default class TestScreen extends React.Component { constructor(props){ super(props); this.qno = 0 this.score = 0 const jdata =
export default class TestScreen extends React.Component {
constructor(props){
super(props);
this.qno = 0
this.score = 0
const jdata = jsonData.quiz.quiz1
arrnew = Object.keys(jdata).map( function(k) { return jdata[k] });
this.state = {
question : arrnew[this.qno].question,
options : arrnew[this.qno].options,
correctoption : arrnew[this.qno].correctoption,
countCheck : 0,
back_colour: 'gray',
answered: false,
}
}
change_colour(ans) {
if(this.state.answered == false){
if(ans == this.state.correctoption){
Alert.alert('Correct!');
this.setState({ back_colour: 'green'})
}
else {
Alert.alert('Wrong!');
this.setState({ back_colour: 'red'})
}
this.setState({ answered: true })
}
else {
// Do nothing
}
}
render() {
let _this = this
const currentOptions = this.state.options
const options = Object.keys(currentOptions).map( function(k) {
return ( <View key={k} style={{margin:10}}>
<Button color={_this.state.back_colour} onPress={() => _this.change_colour(k)} title={currentOptions[k]} />
</View>)
});
}
}
例如
validateUser = id => {
const newItems = items.map(item => {
if(item.id === id ) {
then check anwer here
and trun status true or false ..
}
})
}
items.map(item function() {
<Button color={item.status ? 'red' : 'black' } onPress={() =>
this.validateAnswer(item.id)}>
})
我想这会有帮助的
validateUser = id => {
const newItems = items.map(item => {
if(item.id === id ) {
then check anwer here
and trun status true or false ..
}
})
}
items.map(item function() {
<Button color={item.status ? 'red' : 'black' } onPress={() =>
this.validateAnswer(item.id)}>
})
{
id: '0',
status: true/false
}