Блог

Я использую поле ввода телефона с кодом страны и текстом, я хочу, чтобы на выходе (то есть ) в текстовом поле отображался код страны enter code here и номер, например 233543869957

Я использую formik и визуализирую ввод телефона с другой страницы, как мне его визуализировать

это мой телефонный ввод

 const FormPhone = ({  name,  isRequired,  error,  touch,  ref,  setFieldValue,  ...rest }) =gt; {  const [country, setCountry] = React.useState(COUNTRIES.GH);  const [text, setText] = React.useState('');  const [filed, setFieldValue] = React.useState('');   return (  lt;FormControl id={name} isRequired={isRequired} isInvalid={error amp;amp; touch}gt;  lt;FormLabelgt;Phone numberlt;/FormLabelgt;  lt;PhoneInput  name={name}  country={country}  onCountryChange={({ option }) =gt; setCountry(option)}  text={text}  onTextChange={(e) =gt; {  setText(e.currentTarget.value)  setFieldValue(name, `${country.dialCode}${e.currentTarget.value}`);  }}  placeholder='5555555555'  overrides={{  Root: {  style: {  backgroundColor: '#fff',  height: '30px',  },  },  Input: {  style: {  backgroundColor: '#fff',  height: '30px',  },  },  }}  {...rest}  /gt;  lt;/FormControlgt;  ); };  

экспорт формфона по умолчанию;

моя область формик, в которой я работаю

 lt;Formik  initialValues={{  first_name: "",  last_name: "",  email: "",  dob: "",  phone: "",  country: "",  country_code: "",  password: "",  password_confirmation: "",  and my form phone   lt;FormPhone  onChange={handleChange}  onBlur={handleBlur}  value={values.phone}  error={errors.phone}  touch={touched.phone}  name="phone"  color="#898989"  borderColor="#191191191"   /gt;  

когда я регистрируюсь в консоли, поле код страны пустое , введите описание изображения здесь

and I want the number field to show both country code and number