CODEWITHSUNDEEP
javascriptreact-nativeredux
iNemesis
iNemesis

Reputation: 123

React-native and redux actions

SomeAction is not a function. ( In 'SomeAction()', 'SomeAction' is undefined ).

I get this error when i execute the SomeAction function.

If i only have SomeAction in my actions file and i do 

export default SomeAction;

and then import it as below

import SomeAction from 'path/to/action'

it works fine. But since i want more than one functions, i did the following.

this is my Actions.js

const SomeAction = () => dipatch => ({
    // Code here
});

const AnotherAction = () => dispatch => ({
    // Code here
});

export default { SomeAction, AnotherAction };

then in my App.js

import { SomeAction } from 'path/to/action';
// Here the eslint gives me an error -> 'SomeAction not found in "path/to/action"'

const App = ({ SomeAction }) => {
   // Code here
};

App.propTypes = {
    SomeAction: PropTypes.func,
}

const mapStateToProps = state => ({
    error: state.user.error,
});

export default connect(
    mapStateToProps,
    { SomeAction }
)(App);

This worked on a React web app i was coding. Why not in React-Native?

Upvotes: 0

Views: 57

Answers (2)

Ibrahim Khan
Ibrahim Khan

Reputation: 21

export const SomeAction = () => dipatch => ({

// Code here

};

export const AnotherAction = () => dispatch => ({

// Code here

};

they will be available in your App component in as follow:

import { SomeAction , AnotherAction} from 'path/to/action';

Importing a Defautl export is as follow

import { SomeAction } from 'path/to/action'; or import SomeAction from 'path/to/action';

just use this abpve export const way

Upvotes: 0

Milton BO
Milton BO

Reputation: 608

Reviewing, I see you are exporting by default two methods. Normal implementation is one method. Another solution to do this is exporting one by one methods and importing them with their names.

Example of Exporting:

export const SomeAction = () => dipatch => ({
    // Code here
});

export const AnotherAction = () => dispatch => ({
    // Code here
});

Example of Importing:

import { SomeAction, AnotherAction } from 'path/to/action';

This example is a normal way to export and import functions.

You can not have two default methods exported.

Upvotes: 1

Related Questions