React Redux 商店设置：错误：找不到“商店”

Question

I am trying to setup react-redux store here, and i have error message in browser:

Error: Could not find "store" in the context of "Connect(Card)". Either wrap the root component in a < Provider >, or pass a custom React context provider to and the corresponding React context consumer to Connect(Card) in connect options.

Index.js

import React from 'react';
import ReactDOM from 'react-dom';
import {createStore} from "redux";
import reducer from "./Store/reducer";
import {Provider} from "react-redux";

const store = createStore(reducer);

ReactDOM.render(
    <Provider store={store}>
      <App/>
    </Provider>,
    document.getElementById('root'));

App.js

import React from 'react';
import Counter from "../counter";

const App = props => {

  return (
      <div className="App">
        <Counter/>
      </div>
  );
};

export default App;

Counter.js

import connect from "react-redux/lib/connect/connect";
import Card from "../Components/Card";
import React from "react";

const Counter = (Card);

const mapStateToProps = state => {
  return {
    ctr: state.counter
  };
};

export default connect(mapStateToProps)(Counter);

reducer.js

import {combineReducers} from "redux";

const initialState = {
  counter: 0
};

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

export default reducer

This is a really simple setup and i am not sure where went wrong, please help.

Answer 1

Simply import connect from react-redux:

import { connect } from 'react-redux'

And why are you messing with Card component being used in Counter component. Why don't you directly use to connect there in Card component?