Question

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

注意：在我查看＆＃39; containers / AddTodo.js＆＃39; 的链接中，如果该链接没有直接转到该代码段

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组件中未定义道具

1 个答案: