在url更改时重置redux状态

Question

我有一个项目，redux的工作。但是当我点击<Link>组件或者点击chrome上的“上一页”按钮时，redux会保持我之前更改过的状态。我尝试了connected-react-router中的LOCATION_CHANGE操作，并在reducer中使用它，但它似乎不起作用。

减速机：

import {LOCATION_CHANGE} from "connected-react-router"
function reducer(state=defaultState,action) {
    switch (action.type) {
        case LOCATION_CHANGE:
            console.log("changed")
            return defaultState
        default:
            return state
    }
}

Answer 1

您可以尝试如下所示：

class ScrollToTop extends Component {
  componentDidUpdate(prevProps) {
    if (this.props.location !== prevProps.location) {
      window.scrollTo(0, 0);
      dispatch({ type: LOCATION_CHANGE });
    }
  }

  render() {
    return this.props.children
  }
}

export default withRouter(ScrollToTop)

const App = () => (
  <Router>
    <ScrollToTop>
      <App/>
    </ScrollToTop>
  </Router>
)