Vous souhaitez obtenir des options sur le changement de valeur d'entrée dans React Select
P粉7757237222023-09-14 13:14:36
0
2
378
J'ai un composant React-Select et je souhaite ajouter une fonctionnalité pour qu'une fois que quelqu'un entre quelque chose dans React-Select, il y ait une demande API pour obtenir les éléments liés au mot-clé saisi, comment puis-je faire cela
Vous devriez essayer de regarder AsyncSelect depuis "react-select/async" Créez ensuite une fonction dans le composant pour charger les options de l'API, la fonction doit accepter une chaîne d'entrée et un rappel et doit effectuer un appel API basé sur la chaîne d'entrée. Des choses comme ça
const loadOptions = (inputValue, callback) => { // api call here fetch('your-api-url?${inputValue}') .then(response => response.json()) .then(data => { // do your work here const options = //transform data here callback(options) }); };
Transmettez ensuite la fonction loadOptions dans la propriété loadOptions de votre composant
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Vous pouvez le faire sans aucun appel API, utilisez simplement la méthode de filtrage pour filtrer vos options
Vous devriez essayer de regarder AsyncSelect depuis "react-select/async" Créez ensuite une fonction dans le composant pour charger les options de l'API, la fonction doit accepter une chaîne d'entrée et un rappel et doit effectuer un appel API basé sur la chaîne d'entrée. Des choses comme ça
const loadOptions = (inputValue, callback) => { // api call here fetch('your-api-url?${inputValue}') .then(response => response.json()) .then(data => { // do your work here const options = //transform data here callback(options) }); };Transmettez ensuite la fonction loadOptions dans la propriété loadOptions de votre composant
const YourComponent = () => { return (