I was thinking I could do something like this:

export default () => {
    return [
        {
            text: 'Full-time',
            value: 'fulltime',
            key: 'fulltime'
        },
        {
            text: 'Part-time',
            value: 'parttime',
            key: 'parttime',
        },
        {
            text: 'Freelance',
            value: 'freelance',
            key: 'freelance',
        },
    ]
};

And then in my ponent I could get that data to use in a dropdown like this:

import { positionTypeOptions } from '../ponents/data/PositionTypes';

<Form.Select label="&nbsp;" placeholder="Type" options={positionTypeOptions} width={3} />

However the data does not seem to be exported. The data in undefined. Any ideas how this could be done? I would like to return an array to be used in another ponent.

I was thinking I could do something like this:

export default () => {
    return [
        {
            text: 'Full-time',
            value: 'fulltime',
            key: 'fulltime'
        },
        {
            text: 'Part-time',
            value: 'parttime',
            key: 'parttime',
        },
        {
            text: 'Freelance',
            value: 'freelance',
            key: 'freelance',
        },
    ]
};

And then in my ponent I could get that data to use in a dropdown like this:

import { positionTypeOptions } from '../ponents/data/PositionTypes';

<Form.Select label="&nbsp;" placeholder="Type" options={positionTypeOptions} width={3} />

However the data does not seem to be exported. The data in undefined. Any ideas how this could be done? I would like to return an array to be used in another ponent.

• javascript
• reactjs

• What do you mean by it does not seem to be exported? Do you have any error? What does positionTypeOptions evaluate? – lilezek Commented Sep 24, 2017 at 16:07
• sorry updated the question with positionTypeOptions in {}, which returns undefined. When I do it without {} it returns a function and i want an array – strangeQuirks Commented Sep 24, 2017 at 16:10

2 Answers 2

You are exporting an anonymous function as default. Try this:

export const positionTypeOptions = [
    {
        text: 'Full-time',
        value: 'fulltime',
        key: 'fulltime'
    },
    {
        text: 'Part-time',
        value: 'parttime',
        key: 'parttime',
    },
    {
        text: 'Freelance',
        value: 'freelance',
        key: 'freelance',
    },
];

You don't have to return a function from the export. Just return an object, like this:

export default {
    [
        {
            text: 'Full-time',
            value: 'fulltime',
            key: 'fulltime'
        },
        {
            text: 'Part-time',
            value: 'parttime',
            key: 'parttime',
        },
        {
            text: 'Freelance',
            value: 'freelance',
            key: 'freelance',
        },
    ]
};

For the import, remove the curly brackets since you have a default export:

import positionTypeOptions from '../ponents/data/PositionTypes';