我可以在 Redux 中不使用 mapStateToProps 而使用 mapDispatchToProps 吗?

我打破了 Redux 的 todo 例子,试图理解它。我了解到 mapDispatchToProps允许将调度操作映射为道具,因此我考虑重写 addTodo.js,使用 mapDispatchToProps 而不是调用调度(addTodo ())。我叫它 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.。我从未在 AddTodo 组件上使用过 mapStateToProps,所以我不确定哪里出错了。我的直觉告诉我 connect()期望 mapStateToProps先于 mapDispatchToProps

原件看起来是这样的:

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?我试图做的是一个可接受的做法-如果不是,为什么不呢?

35598 次浏览

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