REDUX에서 값을 읽는 <입력 유형 = 텍스트>

나는 간단한 REDUX 응용 프로그램 및 구성 요소 중 하나가 나는 이름에 입력 한 값을 읽으려는 클릭 이벤트에이

const LoginComponent = ({onLoginClick, onRegisterClick}) => (
    <div className={styles.loginDiv}> 
     <p className={standardStyles.pageTitleText}>SyncSpace</p> 
     <input type="text" placeholder="Username"/> 
     <input type="password" placeholder="Password"/> 
     <div className={styles.loginRegisterDiv}> 
      <button className={styles.loginButton} onClick={onLoginClick}>Login</button> 
      <button className={styles.registerButton} onClick={onRegisterClick}>Register</button> 
     </div> 

    </div> 
);

모양을 쓰고

및 암호 필드를 만들고 onLoginClick 이벤트에 매개 변수로 전달합니다. Redux에서이 값을 읽는 올바른 방법은 무엇입니까?

출처

2017-02-14 tmp dev

redux-form을 살펴 보시기 바랍니다.

질문에 대답 할 수있는 훌륭한 커뮤니티가있는 매우 활발한 프로젝트입니다.

다음 예는 attach a form to the redux store입니다.

REDUX 형태를 사용하면 이런 식으로 양식을 변경할 수 있습니다

import React from 'react'; 
import { Field, reduxForm } from 'redux-form'; 

const LoginComponent = ({onRegisterClick, onLoginClick}) => (
    <form onSubmit={onRegisterClick} className={styles.loginDiv}> 
     <p className={standardStyles.pageTitleText}>SyncSpace</p> 
     <Field name="userName" component="input" type="text" placeholder="Username"/> 
     <Field name="password" component="input" type="password" placeholder="Password"/> 
     <div className={styles.loginRegisterDiv}> 
     <button type="submit" className={styles.loginButton}>Login</button> 
     </div> 
    </form> 
);

을 개인적으로 등록을하고 행동은 두 개의 별도의 뷰에서 발생 로그인을 선호하지만, 당신이 선택하는 경우 두 가지를 가지고 버튼을 누르십시오. 이렇게하려면 여러 가지 방법이 있습니다. This is a good answer on attaching the action to the onClick handlers as you do, but a modification to the action so that it takes in a parameter.

출처

2017-02-14 22:04:31

Redux-Form은 잔인합니다. 확실히은 양식을 읽을 때 어떤 종류의 라이브러리도 필요하지 않습니다.

사실 이것은 실제로 Redux 질문이 아닙니다. 구체적으로 말하면 React 질문입니다. React에서 폼 값을 처리하는 두 가지 방법이 있습니다 : "제어 된"입력과 "제어되지 않은"입력. "클릭하면 값을 읽을 수있는 방법"을 묻는 질문에 대답은 "통제되지 않은 입력에 대해서는"refs를 사용하여 입력 자체에서 읽고, 제어 된 입력에 대해서는 "구성 요소의 상태에서 값 읽기"에 대한 답입니다.

Gosha Arinich는 React에서 양식을 사용하는 방법의 기본을 설명하는 몇 가지 기사를 가지고 있습니다. 먼저 그 내용을 읽어 보시기 바랍니다. https://goshakkk.name/on-forms-react/. "통제 된"입력과 "통제되지 않은"입력의 개념과이를 사용하는 방법을 설명합니다. (Gosha는 또한 형식과 React에 대한 훌륭한 책을 발표했는데, 나는 또한 권장한다. 블로그 게시물보다 더 자세하게 설명되어있다 : https://goshakkk.name/the-missing-forms-handbook-of-react/).

출처

2017-02-14 22:17:43 markerikson

REDUX에서 값을 읽는 <입력 유형 = 텍스트>

답변

관련 문제