如何在使用redux调度操作后导航到另一个屏幕

Question

在API调度一个创建新对象的操作后，它在mapStateToProps上返回该操作。在componentDidUpdate回调中，我可以将对象映射到props，并打开传递它的详细屏幕。问题是，当我返回并尝试创建一个新对象(只需填写表单)时，它一直在用props中最近创建的对象调用componentDidUpdate(因为我正在用用户键入的内容设置状态，而this.props.deck仍在其中)。

有没有另一个生命周期，我可以不在道具或其他逻辑中得到任何垃圾？

我的调度操作：

this.props.createDeck(deckToBeCreated)  // dispatch an action to create a deck

我的减速器的一部分：

case ADD_NEW_DECK_SUCCESS: 
return {
...state,
deck: action.deck,
}

如果成功，我将在这里获得API创建的这个甲板对象：

function mapStateToProps({specificDeckReducer}) {
return {
deck: specificDeckReducer.deck
}
}

componentDidUpdate() { // THE PROBLEM IS HERE.
const { deck } = this.props
if (deck != null && deck.id) {
this.showDeckDetail(deck)
this.reset()
}
}

Answer 1

您可以设置componentDidUpdate()，使其仅在获得更新道具时运行。

componentDidUpdate(prevProps){
if(prevProps.deck !== this.props.deck){
//do something
}
}

这样，生命周期事件就不会一直持续。因此，您应该能够自由导航，而不必担心组件事件。