如何使用 react-phone-number-input 插入数据？插入 phone 数字时出现验证错误

Question

我正在尝试插入数据而不用说 "phone number required"。我填写了 phone 数字字段并且它已满但是当我点击提交时，phone 数字字段验证显示 "phone number required"，尽管我在 [= 中插入了 phone 数字34=]数字字段。

这是phone号的验证：

     if(!values.phoneNumber){
              errors.phoneNumber = 'phoneNumber required'
               }

这是我的小部件编号 Phone:

从 'react' 导入 React，{useState}；

进口'react-phone-number-input/style.css'；从 'react-phone-number-input';

导入 PhoneInput,{isValidPhoneNumber }

             const PhoneWidget = ({

                  step,
                  precision,
                  input,
                  placeholder,
                  label,
                  theme,
                  props,
                  meta: { valid,touched, error },
                  ...rest
                  }) =>
                  {

             const [value,setValue] = useState();


                    return(
                        <div className='form-group'> 
                        <label forname={input.name}>{label}</label> <br />
                         <PhoneInput
                           value={value}
                          placeholder={!input.value ? 'Please, type a number' : input.value}
                             //ISSUE  onChange={event => OnValueChange(event)}
                                    //Problem is here. Maybe I'm not setting the value
                                    onChange= {setValue}
                                              error={value ? (isValidPhoneNumber(value) ? undefined : 
                            'Invalid phone number')    : 'Number Phone required'}
                                     className='form-control'
                                           />
                                  //Here I get the validation error.
                                 {(!valid && touched) &&
                                     <p className='help-block'>{error}</p>
                                           }
                                {/*  <div className='text-danger' style={{ marginBottom: '20px' }}>
                                         {touched && error}
                                          </div>*/      
                                       </div>

                                           )
                                        }


                export default PhoneWidget;

我听不懂。我在数字 phone 字段中键入数据，当我在数字 phone 字段已满时单击提交时，数字 phone 字段获取并显示验证错误显示 "number phone required" .

有人知道我可以解决这个问题吗？

Answer 1

将onChange= {setValue}写成onChange={e=>setValue(e.target.value)}

如何使用 react-phone-number-input 插入数据？插入 phone 数字时出现验证错误

How can I insert a data using react-phone-number-input?, validation error when I'm inserting a phone number

javascript

reactjs

redux-form