0
votes

Comment limiter la liste des pays dans le package de saisie de NPM-Number-numéro-numéro-numéro

Lorsque l'entrée-numéro de téléphone réacteur utilise ce package NPM, je souhaite permettre aux pays limités montrez dans la liste déroulante si l'utilisateur entrait dans un autre pays qui n'est pas dans la liste d'affichage d'affichage de la liste ne permet pas à ce pays qu'il n'y a pas de propulsion où je limite les pays

javascript reactjs

0 commentaires

3 Réponses :

4
votes

Si vous jetez un coup d'œil aux docs Ici , vous verrez que vous pouvez ajouter un Pays CODE> PROP au composant et le fournir avec un tableau de chaînes. Leur exemple montre ce tableau:

["RU", "UA", "KZ"]

1 commentaires

Oui, j'essaie déjà ceci que je veux restreindre que cela ne les accepte que si ce n'est pas dans la liste déroulante, il affiche une erreur de numéro de téléphone non valide.

0
votes

Construisez une gamme personnalisée de pays, puis utilisez la fonction de parsenumber à partir de la bibliothèque de Libphonenumber-JS et obtenez le code de pays du numéro d'entrée utilisateur et comparez-le de votre liste de pays

0 commentaires

0
votes

Pour obtenir cette première liste de création de pays que vous souhaitez afficher en déroulant. Ensuite, sur Flou, exécutez la validation si vous le souhaitez.

import { isValidPhoneNumber } from 'react-phone-number-input';

      <PhoneInput
       defaultCountry="GB"
       flagUrl={'https://flag.pk/flags/4x3/{xx}.svg'}
       countries={whitelist}
       value={phone}
       onChange={(phone) => setState({ phone })}
       onBlur={() =>
       setState({
              hasEnterPhone: true,
              error: {
                ...error,
                phone: !phone
                  ? ''
                  : !isValidPhoneNo(phone) &&
                    'Please enter a valid mobile phone number.',
              },
            })
          }
        />

0 commentaires