CODEWITHSUNDEEP
javascriptreact-nativereact-redux
ugendrang
ugendrang

Reputation: 281

React Native Error: undefined is not a function (evaluating

On writing my first RN application, I have got the below error message on executing the code,

"undefined is not a function (evaluating '_ConfigureStore2.default.dispatch(CategoryAction.categoryView())')"

ConfigureStore.js:

import {createStore, applyMiddleware} from 'redux';
import reducers from '../reducers';
import thunk from 'redux-thunk';

var middlewares = applyMiddleware(thunk);

export default function configureStore(initialState) {
  return createStore(reducers, initialState, middlewares);
}

CategoryContainer.js:

import React, { Component } from 'react';
import stores from '../stores/ConfigureStore';
import * as CategoryAction from '../actions/CategoryAction';

stores.dispatch(CategoryAction.categoryView());

class CategoryContainer extends Component {
}

CategoryAction.js:

import * as actionTypes from './ActionTypes';
import AppConstants from '../constants/AppConstants';

export function categoryView() {
  const categories = ['CATEGORY1', 'CATEGORY2'];
  return {
      type: "CATEGORY_VIEW",
      categories: categories
  };
}

CategoryReducer.js:

const initialState = {
  categories:[],
}

export default function categoryReducer (state = initialState, action) {
  switch (action.type) {
    case CATEGORY_VIEW:
      return Object.assign({}, state, {
              categories: action.categories
            });
    }
}

Even i tried the below approach in CategoryContainer.js, but still got the same error,

import { categoryView } from '../actions/CategoryAction';
stores.dispatch(categoryView());

Kindly assist to solve the issue.

Upvotes: 2

Views: 4024

Answers (2)

ugendrang
ugendrang

Reputation: 281

On changing the ConfigureStore.js as below solves the issue.

import {createStore, applyMiddleware} from 'redux';
import reducers from '../reducers';
import thunk from 'redux-thunk';

/*var middlewares = applyMiddleware(thunk);
export default function configureStore(initialState) { //default is    undefined
  return createStore(reducers, initialState, middlewares);
}*/

const createStoreWithMiddleware = applyMiddleware(thunk)(createStore);
const store = createStoreWithMiddleware(reducers);
export default store;

Upvotes: 0

TheJizel
TheJizel

Reputation: 1900

Give this a shot:

CategoryAction.js

export default class CategoryAction {
    categoryView = () => {
        const categories = ['CATEGORY1', 'CATEGORY2'];
        return {
            type: "CATEGORY_VIEW",
            categories: categories
        };
    }
}

CategoryContainer.js

import React, { Component } from 'react';
import stores from '../stores/ConfigureStore';
import CategoryAction from '../actions/CategoryAction';

stores.dispatch(CategoryAction.categoryView());

class CategoryContainer extends Component {
}

Upvotes: 1

Related Questions