javascript - 需要对一些基本设置进行一些说明

Question

看了几个 Redux 教程后，我还有几个问题:

1. 创建我的商店后，我有:

   ReactDOM.render(, document.getElementById('root'));

   进入 App 组件，我定义:

   function mapStateToProps(state) {
       return {
           posts: state.posts,
           comments: state.comments 
       }
   }
   
   function mapDispatchToProps(dispatch) {
       return bindActionCreators(actions, dispatch)
   }
   

   state 和dispatch 从何而来？自从我将它连接到我的组件后，这是否会自动引用 store 的状态和调度？

2. 我的一个 React 组件有一个表单，在提交时调用一个函数:

   handleSubmit(event) { ... }
   

   所以在该组件的构造函数中，我有:

   constructor() {
       super()
       this.handleSubmit = this.handleSubmit.bind(this);
   }
   

   在声明 React 类组件时是否总是需要调用 super()？为什么我需要在那里进行这种类型的绑定(bind)？

3. 提交该表单后，我发送一个名为 addPost 的操作。它如何“进入” reducer ？是否只是因为在我创建商店并使用 mapDispatchToProps(dispatch) 我“让”Redux 知道可以将哪些操作分派(dispatch)给该 reducer 时提供了 reducer？

4. reducer 只返回一个state 对象。实际将该状态“保存”到商店中的逻辑在哪里？是不是隐藏了？

Answer 1

1. 是的，请客state和 dispatch分别作为对您的 redux 状态和调度函数的引用。

2. React docs说:

   If you don’t initialize state and you don’t bind methods, you don’t need to implement a constructor for your React component.

为你的处理程序尝试一个箭头函数:

class MyComponent extends Component {
    handleSubmit = () => {
        // ...
    }
}

1. reducer 给了 store，store 给了 react-redux <Provider>组件，Provider 组件提供了一个 React context后代组件中的分派(dispatch)操作被所述缩减器接收。

2. 该逻辑在 redux 库中。