道具在 redux 组件中未定义

Question

给定以下组件，其结构类似于 redux's demo component。我的主要问题是 props 始终未定义 即使商店中的状态完全有效

注意：在link我看的是'containers/AddTodo.js'，如果link没有直接带你去片段

import React from 'react';
import { connect } from 'react-redux';
import Glyphicon from 'react-bootstrap/lib/Glyphicon';
import Label from 'react-bootstrap/lib/Label';


let HeaderContainer = ({props}) => { //props = undefined
  return(
    <div>

      <Label bsStyles="warning">
        <Glyphicon glyph="exclamation" />
      {props.openCount}
      </Label>

      <Label bsStyle="success">
        <Glyphicon glyph="ok" />
      {props.completedCount}
      </Label>

    </div>
  );
}

const mapStateToProps = (state) => {
  return {
    openCount: state.tasks.filter( task => !task.completed).length,
    completedCount: state.tasks.filter( task => task.completed ).length
  };
}

HeaderContainer = connect(mapStateToProps)(HeaderContainer);
export default HeaderContainer;

Answer 1

从 ({props}) 中删除 {}。如果你想使用解构，试试({openCount, completedCount})

let HeaderContainer = (props) => //...

let HeaderContainer = ({openCount, completedCount}) => //..

道具在 redux 组件中未定义

Props are undefined in redux component

redux

react-redux