我正在创建一个使用 Redux 架构处理状态的组件(是的,根据定义,这可能很糟糕,因为组件应该将状态委托给应用程序,但无论如何)。
此组件接受不同的道具。当我必须处理回调时,我的问题出现了。让我们举一个实际的例子来更好地描绘它。
假设我们需要一个像<App onSubmit={() => {}} />
这样的组件。
当组件获得 mount 时,我们可以创建商店,因此所有内部组件都可以调度操作/订阅更改/等。
尝试可能是将{strong>操作称为submit()
。通过这种方式,商店会知道有适用的更改,因此任何订阅者都会知道,并且有人会将此 onSubmit 回调称为。
所以代码看起来像:
class App extends Component {
constructor (props) {
super(props)
this.subscriber = this.subscriber.bind(this)
}
componentWillMount() {
this.store = createStore()
this.store.subscribe(this.subscriber)
}
subscriber (action) {
if (action.type === 'submit')
this.props.onSubmit()
}
render () {
return (
<Provider store={this.store}>
<FooComponent />
</Provider>
)
}
}
问题在于,虽然调度的每个操作都会调用subscriber
,但订阅者无法知道调度的最后一个操作是什么。因此,无法知道何时致电onSubmit
。
subscriber
了解商店的变化?答案 0 :(得分:7)
这是Redux中的反模式。
没有“最后一次操作”这样的事情,因为Redux保留在几次嵌套调度的情况下只通知您一次的权利。
相反,您应该与动作一起执行本地副作用 。 Redux Thunk是一种流行的方式。如果你需要更多的去耦,你可能会喜欢Redux Saga。