controlled-component

How to stop cursor from jumping to the end of input

天涯浪子 提交于 2020-05-14 19:48:45
问题 I have a controlled React input component and I am formatting the input as shown in onChange code. <input type="TEL" id="applicantCellPhone" onChange={this.formatPhone} name="applicant.cellPhone" value={this.state["applicant.cellPhone"]}/> And then my formatPhone function is like this formatPhone(changeEvent) { let val = changeEvent.target.value; let r = /(\D+)/g, first3 = "", next3 = "", last4 = ""; val = val.replace(r, ""); if (val.length > 0) { first3 = val.substr(0, 3); next3 = val.substr

Is this a controlled or uncontrolled React component?

巧了我就是萌 提交于 2019-12-13 04:17:32
问题 I read the answers on this question but none is similar to my set up: What are controlled components and uncontrolled components? I have a parent component and many children as inputs. Each input has a defaultValue that is set using a prop received from the parent and the validation of the input is performed on onBlur . This is because the validation is asynchronous, so onChange would slow down the app like crazy. How is this orchestration called? The traditional definition for "controlled"