Понимание mapStateToProps и mapDispatchToProps в React-Redux - PullRequest
1 голос
/ 11 июля 2020

Я пытаюсь понять connect() метод react-redux . Обычно в качестве аргумента используются две функции: mapStateToProps() & mapDispatchToProps(). Я пишу для себя пример, вот раздел connect() моего User компонента:

//imports...

class User extends Component {
    /* constructor, JSX, other functions... */
}
const mapStateToProps = (state) => {
   return {
     users: state.UserReducer
   };
};

const mapDispatchToProps = (dispatch) => ({
  deleteUser: (id) => dispatch(deleteUser(id))
});

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

Согласно Docs Я сделал следующие два вывода о mapStateToProps() & mapDispatchToProps():

  • mapStateToProps () : делает это состояние доступным в нашем компоненте. т.е. он используется для передачи reducer компоненту.
  • mapDispatchToProps () : он сопоставляет функции, относящиеся к компоненту, с функциями action, т.е. с помощью этой функции мы можем выполнять action что мы хотим в нашем component.

мои выводы верны?

1 Ответ

3 голосов
/ 11 июля 2020

Компоненты React принимают данные извне через props. maptStateToProps и mapDispatchToProps, буквально, передают выбранные свойства состояния и действия, которые необходимы внутри вашего компонента в качестве свойств. Значения состояния и действия, переданные компоненту, доступны в свойствах компонента. В вашем примере вы можете использовать this.props.users или this.props.deleteUser().

...