如何使用 react-phone-number-input 插入数据？，插入电话号码时出现验证错误答案

【问题标题】：How can I insert a data using react-phone-number-input?, validation error when I'm inserting a phone number如何使用 react-phone-number-input 插入数据？，插入电话号码时出现验证错误
【发布时间】：2020-02-25 13:08:16
【问题描述】：

我正在尝试插入一个没有说“需要电话号码”的数据。我填写了电话号码字段并且它已满，但是当我点击提交时，电话号码字段验证显示“需要电话号码”，尽管我在电话号码字段中插入了电话号码。

这是电话号码的验证：

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

这是我的小部件号码电话：

从 '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;

我无法理解。我在电话号码字段中输入数据，当我在电话号码字段已满时单击提交时，电话号码字段获取并显示验证错误为“需要电话号码”。

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

【问题讨论】：

标签： javascript reactjs redux-form

【解决方案1】：

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

【讨论】：

我遇到了这个问题：TypeError: Cannot read property 'value' of undefined