React-Redux 连接不起作用

Question

我正在尝试在我的 codepen 笔中使用 React+Redux，但连接没有注入(inject) Prop ，

也许是因为作为一个业余爱好者，我错过了一些东西。请看一看。
http://codepen.io/sahil28v/pen/EKEKME?editors=0010

const { Component } = React;
const { createStore, bindActionCreators, applyMiddleWare, combineReducers } =     Redux;
const { Provider, connect } = ReactRedux;

const Application = () =>  (
        <div className="ground">
    <Tmap />
        </div>
    );

class Tmap extends Component {
  constructor(props){
  super(props);
  console.log(this.props.mapstate);  // This is returning undefined,no idea why
  console.log(store.getState().mapstate); // Though this returns val: "hey" as it should properly though.
 }
 render () {
  return (
   <div>

   </div>
  );
 }
}

const mapStateToProps = (state) => ({
mapstate: state.mapstate
});

connect(mapStateToProps)(Tmap);

const initialState = {
  val: "hey"
}

const mapReducer = (state = initialState, action) => {
 return state ;
} ;

const rootReducer = combineReducers({
  mapstate: mapReducer,
});

const store = createStore(rootReducer);

React.render(
    <Provider store={store}>
        <Application />
    </Provider>, document.getElementById('app')
);

另外，我可以在codepen本身中配置存储以使用redux devtools(chrome扩展)。
我尝试添加 ...window.devToolsExtension ？ window.devToolsExtension() : f => f ，创建商店，但这不起作用。

当有人在回答时——你能否推荐好的文档/视频:
->学习ES6 ...

- 谢谢您的帮助

Answer 1

不要导出 function或 class导出connector类(class)

//don't use export here
function ProductCounterPage(props) {
    const {
        ProductItem,
        OrderItemList,
        onCountChange,
        ...rest
    } = props;
    ...............
}

export default connect(mapStateToProps, null)(ProductCounterPage);