피드백 양식에서 onBlur의 양식을 업데이트 할 수 없습니다.

Question

필드가 AskQuestions인데 사용자가 무언가를 입력하면 각 사용자 키 입력에 업데이트 된 결과가 배열 companyOptions으로 나타납니다. 그러나 사용자가 필드를 클릭하면 this.props.dispatch(change..))을 통해 현재 필드의 값을 지우려고 시도하지만 불가능한 것처럼 보입니다.

<Field 
    name="company" 
    type="text" 
    onBlur={this.onClearSearch} 
    keyUp={this.renderCompanyList} 
    component={renderField} 
    label="Choose Company..."/> 

여기 내 renderField

나는 다음과 같은 콜백 연결 한

function renderField(field) { 
    const { meta: {touched, error} } = field; 
    return(
    <div> 
     <input type={field.type} 
      placeholder={field.label} 
      onKeyUp={field.keyUp ?() => {field.keyUp(field.input.value)} : ""} 
      onBlur={field.onBlur ?() =>{field.onBlur()} : ""} 
      {...field.input} 
      // I also tried putting in after ...input 
      // onBlur={field.onBlur ?() =>{field.onBlur()} : ""} 
      /> 
      <div className="text-danger"> 
      {touched ? error : ''} 
      </div> 
    </div> 
); 
} 

이지만, this.props.dispatch 필드를 재설정하지 않습니다.

onClearSearch(){ 
    this.props.dispatch(change('AskQuestion','company','')); 
} 

Answer 1

그것의 기본 이벤트 함수 onClearSearch에 의해 수정 된 후 입력의 값을 수정 onBlur,

가이 문제를 해결해야합니다 onClearSearch의 끝에 e.preventDefault() 추가가 있기 때문에, 이 같은 :

onClearSearch(e){ 
    const {companyOptions} = this.state; 
    if (companyOptions.length){ 
    var company = companyOptions[0]; 
    this.props.dispatch(change('AskQuestion','company',company.label)); 
    } 
    else { 
    this.props.dispatch(change('AskQuestion','company','')); 
    } 
    // hides the dropdown view 
    this.setState({showCompanySearch:false}) 
    // here 
    e.preventDefault(); 
} 

More info here

나는이 C 희망 도움이