Redux에서 mapStateToProps없이 DispatchToProps를 매핑 할 수 있습니까?
나는 그것을 이해하기 위해 Redux의 할일 예제를 분리하고 있습니다. 나는 mapDispatchToProps디스패치 액션을 소품으로 매핑 할 수 있다는 것을 읽었 으므로 addTodo.jsdispatch (addTodo ())를 호출하는 대신 mapDispatchToProps를 사용하도록 다시 작성 하는 것을 생각했습니다 . 나는 그것을 불렀다 addingTodo(). 이 같은:
import React from 'react';
import {connect} from 'react-redux';
import addTodo from '../actions';
let AddTodo = ({addingTodo}) => {
let input;
return (
<div>
<form onSubmit={e => {
e.preventDefault()
if (!input.value.trim()) {
return
}
addingTodo(input.value)
input.value = ""
}}>
<input ref={node => {
input = node
}} />
<button type="submit">Submit</button>
</form>
</div>
)
}
const mapDispatchToProps = {
addingTodo: addTodo
}
AddTodo = connect(
mapDispatchToProps
)(AddTodo)
export default AddTodo
그러나 앱을 실행할 때 다음 오류가 발생 Error: Invalid value of type object for mapStateToProps argument when connecting component AddTodo.합니다.. 나는 mapStateToPropsAddTodo 구성 요소에서 시작하는 데 사용하지 않았 으므로 무엇이 잘못되었는지 확신하지 못했습니다. 내 직감은 그것이 선행 을 connect()기대 한다고 말합니다 .mapStateToPropsmapDispatchToProps
작업 원본은 다음과 같습니다.
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">Submit</button>
</form>
</div>
)
}
AddTodo = connect()(AddTodo)
export default AddTodo
제 질문은 mapStateToProps없이 mapDispatchToProps를 수행 할 수 있습니까? 내가하려는 것이 수용 가능한 관행입니까? 그렇지 않다면 왜 안됩니까?
Yes, you can. Just pass null as first argument:
AddTodo = connect(
null,
mapDispatchToProps
)(AddTodo)
Yes, it's not just acceptable practice, it's recommended way to trigger actions. Using mapDispatchToProps allows to hide the fact of using redux inside your react components
'Nice programing' 카테고리의 다른 글
| Gradle의 종속성 그래프에서 '->'(화살표)는 무엇을 의미합니까? (0) | 2020.11.11 |
|---|---|
| Android Instrumentation 테스트와 Android Studio의 단위 테스트의 차이점은 무엇입니까? (0) | 2020.11.11 |
| 'foreach'루프에서 목록을 수정하는 가장 좋은 방법은 무엇입니까? (0) | 2020.11.11 |
| Jquery $ (this) 자식 선택기 (0) | 2020.11.11 |
| C에서 좋은 해시 테이블 구현을 찾고 (0) | 2020.11.11 |