Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
538 views
in Technique[技术] by (71.8m points)

antd-mobile InputItem type=phone的疑问

browser / google chrome / antd-mobile: 1.0.3

code:

<InputItem
     {...getFieldProps('phone',
      {
        initialValue: item.consigneePhone,
        rules: [
          {required: true, message: '请输入手机号码'},
        ],
      })}
    error={!!getFieldError('phone')}
    onErrorClick={() => {
      Toast.fail(getFieldError('phone'), 1);
    }}
    type="phone"
    placeholder="请输入手机号码">
    手机号码
</InputItem>

疑问:

  1. 设置 value = '18612341234' 后, 无法进行输入操作

  2. 设置 defaultValue = '18612341234' 无效, 并且提示警告

    `Warning: InputItem contains an input of type tel with both value and defaultValue props. Input elements must be either controlled or uncontrolled (specify either the value prop, or the defaultValue prop, but not both). Decide between using a controlled or uncontrolled input element and remove one of these props. More info: https://fb.me/react-controlled-components`
  3. 通过getFieldProps 设置initialValue , value正常, 但是格式需要手动处理

期望结果

设置 value 正常, 可以进行编辑. 并且有格式, eg. 186 1234 1234


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)

报告 bug 上 github 提 issue,仔细阅读issue模板,提供能复现的在线demo最佳


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...