재료의 UI 텍스트 필드는

Question

I는 그것에 TextField와 성분 반응 가지고

<TextField 
    hintText="name" 
    floatingLabelText="Your name:"/> 

컴퍼넌트 반응-REDUX의 connect 함수를 사용하여 생성 된 컨테이너를 통해 저장소에 연결된다 . 지금은 컨테이너에 전달 된 매개 변수가 없습니다. 그리고 구성 요소의 아무 곳이나 아무런 작업도 전달되지 않습니다. 내 TextField에 텍스트를 입력 할 때

, 내가 볼 수 REDUX - DevTools로에서 일부 조치가 전달되는 것을 볼 :

그것은 항상 같은 SET_FOCUS_PAGE 조치가 각 문자에 파견되는 것 페이지 속성을 change 이벤트 TextField으로 설정하여 입력합니다. 또한 콘솔에 내가 그 경고가 많이 있습니다

Warning: This synthetic event is reused for performance reasons. If you're seeing this, you're accessing the property `bubbles` on a released/nullified synthetic event. This is set to null. If you must keep the original synthetic event around, use event.persist(). See react-event-pooling for more information. 

내가이 모든 이해하는 데 실패를 왜 작업에 액세스 할 수없는 구성 요소에 의해 발송되는 SET_FOCUS_PAGE입니까? change 이벤트가 페이지 속성에서 어떻게 끝날 수 있습니까? 거기서 무슨 일이 일어나고있는거야?

Answer 1

당신은 syntheticx 이벤트를 redux 상태 트리에 전달하는 것처럼 보입니다. 이벤트 자체 대신 값이 일 가능성이 큽니다. 예를 들어

: 호출

<TextField 
    hintText="name" 
    floatingLabelText="Your name:" 
    onChange={(event) => handleChangeText(event)} 
/> 

: 그와 상태 트리를 업데이트하는 경우, 당신은 당신이 필요

const handleChangeText = (event) => { 
    console.log('the text is:', event.target.value); 
} 

을 받고해야한다. 내가 작성한 곳에서 console.log는 입력을 포착하기위한 작업을 시작하는 곳입니다.