Sto rompendo l'esempio di Redux todo per cercare di capirlo. Ho letto che mapDispatchToPropsti consente di mappare le azioni di invio come oggetti di scena, quindi ho pensato di riscrivere addTodo.jsper utilizzare mapDispatchToProps invece di chiamare dispatch (addTodo ()). L'ho chiamato addingTodo(). Qualcosa come questo:
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
Tuttavia, quando si esegue l'applicazione, ottengo questo errore: Error: Invalid value of type object for mapStateToProps argument when connecting component AddTodo.. Non ho mai mapStateToPropsiniziato con il componente AddTodo, quindi non ero sicuro di cosa fosse sbagliato. Il mio istinto dice che connect()dovrebbe mapStateToPropsprecedere mapDispatchToProps.
L'originale funzionante ha questo aspetto:
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
Il repo completo può essere trovato qui .
Quindi la mia domanda è: è possibile eseguire mapDispatchToProps senza mapStateToProps? Quello che sto cercando di fare è una pratica accettabile - se no, perché no?