Ich möchte mehr Informationen onclick zeigen, aber ich habe verschiedene Divs zum Anzeigen/Verbergen. So. Ich mache es so: Der Staat ist:Zeige mehr Informationen in React
this.state = {
showMore: false,
showRewards: false,
fees: false,
showFees: false
};
Einer der divs:
<div className='some'> <h3 >Rewards <i className="icon-im-rewards"></i></h3> <h5 className="showMoreDetails" onClick={() => this.show('rewards') }>{ showRewards ? '-' : '+' } { showRewards ? 'Show Less' : 'Show More' }</h5> { showRewards && detail.rewards.reward.map((name, i) => <p key={i}> { name }</p> ) } </div>
Die Funktion:
Show (name) { let {Showmore , showRewards, showFees} = this.state;
if (name === 'hightlights' && showMore === false) {
this.setState({
showMore: true
});
} else {
this.setState({
showMore: false
});
}
if (name === 'rewards' && showRewards === false) {
this.setState({
showRewards: true
});
} else {
this.setState({
showRewards: false
});
}
if (name === 'fees' && showFees === false) {
this.setState({
showFees: true
});
} else {
this.setState({
showFees: false
});
}
Dies ist zu lang, hässlich und nicht richtig funktioniert (ich kann nur eine erweiterte div zu einem Zeitpunkt, sehen) Wie es zu verbessern?
es ist viel besser, aber ich kann immer noch nur ein zu einer Zeit sehen –