react-component/form

validateTrigger 'onBlur' can't use In react-native TextInput

Open

#157 opened on Apr 13, 2018

View on GitHub
 (5 comments) (3 reactions) (1 assignee)JavaScript (1,801 stars) (300 forks)batch import
help wanted

Description

I use the example of the react-native. After add validateTrigger, the value always to be empty, when the TextInput blur.

"react": "^16.2.0", "react-native": "0.53.3", "rc-form": "^2.1.7",

{getFieldDecorator('username', {
          validateFirst: true,
          validateTrigger: 'onBlur', // **add code here**
          rules: [
            { required: true, message: '请输入手机号!' },
            {
              pattern: /^1\d{10}$/,
              message: '请输入正确的手机号!',
            },
            {
              validator: (rule, value, callback) => {
                this.checkUserNameOne(value, callback);
              },
              message: '手机号已经被注册!',
            },
          ],
        })(
          <FromItem
            autoFocus
            placeholder="手机号"
            error={getFieldError('username')}
          />
        )}

Can you help me to explain it?

Contributor guide

Tech stack
reactreact nativejavascript
Domain
frontendmobile
Issue type
bug
DifficultyEstimated implementation difficulty for a new contributor, from 1 for very small changes to 5 for expert-level work.
3
Estimated timeA rough time range for an experienced contributor to investigate, implement, test, and prepare a pull request.
1-3 hours
Activity statusHow available the issue appears right now: fresh, active, stale, blocked, or waiting on maintainer input.
blocked
ClarityHow clearly the issue explains the expected change, acceptance criteria, and next step.
mostly clear
Prerequisites
React Native basicsrc form library
Newbie friendlinessA 1-100 score estimating how approachable this issue is for first-time contributors.
40
Research direction
Investigate how the validateTrigger 'onBlur' is handled in the rc form library for React Native. Look at the source code in the `src` directory for the event handling logic, particularly in `createForm` or `getFieldDecorator`. The bug may be due to incorrect propagation of the blur event to the form's validation system. Consider testing with a minimal example and checking if the issue is specific to a particular version of the library.