0

I am using redux-thunk to get data from json file .I follow this url

https://github.com/gaearon/redux-thunk I am getting this error

middleware is not a function

could you please tell me how to get data from json file and show in component

here is my code https://plnkr.co/edit/R6TCNcK4kUaRkTDpObQN?p=preview

const {thunk} =ReduxThunk;
const abc= (state=0,action) => {
  console.log('in redux', action.type)
  switch(action.type){
    case 'INC':

      return state +1
    case 'DEC':
      return state -1
      default :
      return state;
  }
}
const {createStore,bindActionCreators ,applyMiddleware } =Redux;
const {Provider,connect} =ReactRedux;

const store = createStore(abc,
applyMiddleware(thunk)
);


class First extends React.Component {
  constructor (props){
    super(props);
    this.state ={
    digit :0  
    }
  }
  inc (){
    console.log('ince', this.props)
    this.props.increment();
  }

  dec (){
    console.log('dec')
    this.props.decrement();
  }
  getDate(){

  }
  render(){
    return (
    <div>
        <button onClick={this.inc.bind(this)}>INCREMENT</button>
        <p>{this.props.digit}</p>
        <button onClick={this.dec.bind(this)}>DECREMENT</button>
        <button onClick={this.getDate.bind(this)}>GET DATA</button>
      </div>
    )
  }
} 

const actions = {
    increment: () => {
        return {
            type: 'INC',
        }
    },
     decrement: () => {
        return {
            type: 'DEC',
        }
    }
};

const AppContainer = connect(
    function mapStateToProps(state) {
        return {
            digit: state
        };
    },
    function mapDispatchToProps(dispatch) {
        return bindActionCreators(actions, dispatch);
    }
)(First);
ReactDOM.render(
   <Provider store={store}>
    <AppContainer/>
  </Provider>
  ,document.getElementById('root'))
user5711656
  • 3,310
  • 4
  • 33
  • 70

1 Answers1

0

You were almost there.

Just replace the very first line with this:

const thunk = ReduxThunk.default;

They have changed the way of exporting and mentioned it on their github readme

Swapnil
  • 2,573
  • 19
  • 30
  • could you please change in plunker and get data from file – user5711656 Dec 27 '16 at 12:03
  • Updated the plunker: https://plnkr.co/edit/OfwSHVj8Y1in1wOQgeTy?p=preview – Swapnil Dec 27 '16 at 12:41
  • If you want to include a JSON from another file, either use import/export with a module bundler or just use a script tag in the html file and provide the src attribute with the path of the file (which I did in the plunker since there wasn't any module bundler over there) – Swapnil Dec 27 '16 at 12:44
  • what is use of thunk – user5711656 Dec 27 '16 at 15:16
  • There is a very good answer to this question over [here](http://stackoverflow.com/questions/34570758/why-do-we-need-middleware-for-async-flow-in-redux/34584313#34584313) – Swapnil Dec 27 '16 at 15:25