2016-12-08 1 views
5

docs의 Redux 예제 중 하나에서 connect 함수는 args없이 호출됩니다. 이것은 예제의 맨 아래에서 볼 수 있습니다. 나의 이해는 컨테이너 구성 요소를 aswell 소품의 형태로 상점에서 상태에 대한 액세스와 같은 콜백의 형태로 작업을 디스패처에 대한 액세스 권한을 부여 할 수있는 연결 기능의 목적에서mapStateToProps 또는 mapDispatchToProps없이 args로 함수를 호출하는 이유는 무엇입니까?

import React from 'react' 
import { connect } from 'react-redux' 
import { addTodo } from '../actions' 

let AddTodo = ({ dispatch }) => { 
let input 

return (
    <div> 
    <form onSubmit={e => { 
     e.preventDefault() 
     if (!input.value.trim()) { 
     return 
     } 
     dispatch(addTodo(input.value)) 
     input.value = '' 
    }}> 
     <input ref={node => { 
     input = node 
     }} /> 
     <button type="submit"> 
     Add Todo 
     </button> 
    </form> 
    </div> 
) 
} 

AddTodo = connect()(AddTodo) 

export default AddTodo 

.

따라서 구성 요소 액세스 권한을 부여 할 상태 및 작업 작성자를 지정하지 않고 연결을 호출하는 이유는 이해할 수 없습니다.

+0

'connect() (AddTodo)'는'dispatch'를 소품으로 전달합니다. 상태 나 사전 정의 된 동작이 없어도 여전히 유용합니다 – azium

+0

고마워요. 왜 우리는 상점에서의 방법으로 호출하고 상점을 가져올 수있을 때 소품으로 파견을 전달하기를 원합니까? – therewillbecode

+0

대답을 만들었습니다. 잘하면 주소가 – azium

답변

5

connect()(AddTodo)은 AddTodo 구성 요소의 보조 도구로 dispatch을 전달하며 상태 또는 미리 정의 된 동작 없이도 유용합니다.

Redux (및 react-redux)는 매우 낮은 수준의 라이브러리입니다. 구성 요소가 액세스 할 수있는 상태 및 조치에 대해 매우 엄격하게 지정하거나 전체 상점 및 모든 조치를 모든 구성 요소에 전달할 수 있습니다.

응용 프로그램에 적합한 엄격한 수준을 결정하는 것은 사용자의 책임입니다.

connect을 사용하는 이유는 무엇입니까? 그럼 connect은 React 컨텍스트를 통해 저장소/디스패치를 ​​전달하기 때문에 많은 구성 요소를 통해 저장소를 전달할 필요가 없습니다. 그래도 connect을 사용하는이 없습니다. 모든 모듈/HOC 패턴이 작동 할 수 있습니다. connect이 사용하기에 편리합니다.

+0

이 필요합니다. dispath가 아직 전달되지 않습니까? – DDave

+0

@DDave'dispatch'는 인수가 있거나없는 래핑 된 구성 요소에 대한 소품으로 전달 된 전달됩니다. 그게 네가 묻고있는거야? – azium

+0

예, 감사합니다. – stackdave

관련 문제