Redux 的 store 服务最终被 React App 中的各种组件所使用。它公开的方法（例如 dispatch、getState 和 subscribe）被各种组件（例如容器或表示）使用。

我认为传递这种商店服务的方法是一个重要的设计决策。我看到两种方法，它们是：

1）通过将商店作为props传递给所有嵌套级别的每个组件。这不是推荐的。

2) 使用像 react-redux 这样的工具，它在上下文的帮助下，使存储（确切地说是状态和调度）在任何需要的地方可用。

我的问题是：为什么不在需要的地方简单地导入商店。对于基于 SPA 的 React 应用程序，商店将是一个单例。嵌套在任何级别的组件都可以简单地导入商店。为什么我们要采用上述两种方法中的任何一种？

对于任何嵌套级别的组件：我们可以这样做吗

import store from  "path/to/store";

let MyComponent = () => {
    let state = store.getState();

    return (
        <div onClick={() => {
            store.dispatch({
                type: "SOME_EVENT",
                payload: store.somedata
            });
        }}>{state.dataINeedHere}</div>
    );
};

export default MyComponent;

代替

import { connect } from "react-redux";

let MyComponent = ({somedata, onMyAction}) => {
    let state = store.getState();

    return (
        <div onClick={() => {
            onMyAction(somedata);
        }}>{somedata}</div>
    );
};

const mapStateToProps = (state) => {
  return {
    somedata: state.somedata
  }
}

const mapDispatchToProps = (dispatch) => {
  return {
    onMyAction: (input) => {
      dispatch({
          type: "SOME_EVENT",
          payload: input
      });
    }
  }
}

export default connect(mapStateToProps, mapDispatchToProps)(MyComponent);