Export default works, but export anything else does not in React

Question

I am fairly new to ES6.

I am trying to call a function with two arguments:

export XYZ withFetching(noticeAPI)(promoIter)

and

export withFetching(noticeAPI)(promoIter)

It works when I do it as:

export default withFetching(noticeAPI)(promoIter)

The function looks like this:

const withFetching = (url) => (Comp) =>

Why does it work with the default keyword but not with any type of names?

Sorry if this is a dumb question about ES6, but I've tried every variation of the export syntax that I found on here with no luck.

https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/export

loganfsmyth · Accepted Answer · 2019-04-12 19:54:31Z

1

export default withFetching(noticeAPI)(promoIter);

is short for

const _invisibleVariable_ = withFetching(noticeAPI)(promoIter);
export { _invisibleVariable_ as default };

So given your example

export XYZ withFetching(noticeAPI)(promoIter)

assuming you want XYZ to be the name, you can do

const XYZ = withFetching(noticeAPI)(promoIter);
export { XYZ };

or

export const XYZ = withFetching(noticeAPI)(promoIter);

answered Apr 12, 2019 at 19:54

loganfsmyth

162k31 gold badges349 silver badges259 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Jordan · Accepted Answer · 2019-04-12 04:03:57Z

0

Hi did you try like this ?

export const XYZ = withFetching(noticeAPI)(promoIter);

And then importing it like this

import { XYZ } form 'somepath';

answered Apr 12, 2019 at 4:03

Jordan

1666 bronze badges

3 Comments

Steven Matthews Over a year ago

I did try export const XYZ = withFetching(noticeAPI)(promoIter); at one point, and I get the error: Line 42: Parsing error: Unexpected token on the export withFetching etc line

Ajay Gupta Over a year ago

How about export const XYZ = (noticeAPI, promoIter) => withFetching(noticeAPI)(promoIter)

Steven Matthews Over a year ago

No error gets thrown with that, but when I try to use <XYZ /> after import in another component, console gives the error: Warning: Functions are not valid as a React child.

Collectives™ on Stack Overflow

Export default works, but export anything else does not in React

2 Answers 2

Comments

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related