J'ai un
3 Réponses :
Peut-être que la solution la plus simple serait simplement d'essayer d'aller chercher les valeurs requises à partir de votre réseau d'options en fonction de la valeur sélectionnée.
Donc, dans votre gestionnaire ONCHANGE, recherchez une route correspondante par la valeur sélectionnée.
Pouvez-vous s'il vous plaît fournir un exemple de code spécifique réponse afin que je puisse vérifier votre idée?
Depuis la route est dans cet article.Props.state (peut-être le renommer pour le rendre moins déroutant) Vous n'avez pas besoin de le transmettre:
class RouteSelect extends React.Component {
state = {
selectedRoute: {
name: '',
number: '',
},
};
//make it an arrow function to auto bind this
setSelectedRoute = e =>
this.setState({
selectedRoute: {
name: e.target.value,
number: this.props.state.routes.Route,
},
});
render() {
let routes = this.props.state.routes;
let routeOptions = routes.map(route => (
<option key={route.Route._text}>
{route.Description._text}
</option>
));
return (
<>
<select
value={this.state.selectedRoute.Description}
onChange={this.setSelectedRoute}
>
{routeOptions}
</select>
{console.log(this.state)}
</>
);
}
}
export default RouteSelect;
Souhaitez-vous s'il vous plaît jeter un oeil à la mise à jour de ma question? Merci beaucoup pour votre aide avec cela.
la dernière syntaxe pourrait ressembler à quelque chose comme ceci: Je pense qu'il est important de noter que vous ne devez jamais utiliser ceci.props.state.x comme c'est déroutant. Les données doivent soit être traitées par l'état (état local ou Redux Store) ou transmis ci-dessus via des accessoires.
Puisque vous utilisez des crochets peut-être essayer de l'USESTE pour handlechange \
@Oliver, pouvez-vous vérifier ma question à nouveau? J'ai ajouté une section de mise à jour où j'ai utilisé votre suggestion. Je suis toujours incapable d'accéder au numéro de route, mais peut-être que vous saurez ce que je fais mal? Merci encore pour votre aide!
Où sont les données de route réelles? Il semble que vous essayiez de faire encore plus que vous avez posté ici et qu'il est difficile d'aider à deviner à ce qui se passe.
@Oliver j'ai mis à jour ma question à inclure le composant qui obtient les données.
J'ai légèrement modifié ma réponse - le routes.route N'est-ce pas ce que vous voulez passer à cette funciton, vous voulez probablement routes.description ou routes.route.description
Pourquoi passer la route vers SEstSelectedRoute? Vous avez
ceci.props.state.routes.route disponible dans cette fonction afin de pouvoir simplement faire:onchange = {this.setselectedroute} . Vous pouvez également définirsetSelectedRoute en tant que fonction flèche afin de ne pas obtenir de problèmes de liaison.Je crois que votre approche n'est pas la meilleure mais vous pouvez essayer de lier la fonction par
myfunction.bind (null, argument1, argument2)@Hmr pouvez-vous s'il vous plaît ajouter ceci dans une réponse? Si cela fonctionne, j'aimerais vous donner un crédit.