How to use import statement in react?

Question

how to use import statement to import functions from one component to other component.

Below is how the import statement is:

import Tool from '../Common'; import { ToolContextProvider } from '../Common';

This complaint of duplicate lines. So I have tried something like below,

import { ToolContextProvider, Tool} from '../Common';

But this doesn't seem to be correct. How can write this in one line. Could someone help me with this? Thanks.

I have previously answered similar question. Hope it gives you some insights. stackoverflow.com/questions/62265810/… — ttt
– ttt, Commented Jul 17, 2020 at 6:34

Surjeet Bhadauriya · Accepted Answer · 2020-07-17 06:30:41Z

4

You can import like this. Just combine both of them.

import Tool, { ToolContextProvider } from '../Common';

answered Jul 17, 2020 at 6:30

Surjeet Bhadauriya

7,2223 gold badges39 silver badges54 bronze badges

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

Comments

amdev · Accepted Answer · 2020-07-17 06:46:59Z

basically there are two different type of export in javascript modules (also react included):

default export
named export

default export would be like :

 // someFile.js export default SomeComponent

named export would be like

 // someFile.js export SomeOtherComponent

importing them in other components for using them should be like:

// useCase.js import SomeComponent from './someFile' // for default export import { SomeOtherComponent } from './someFile' // for named export import SomeComponent, { SomeOtherComponent } from './someFile' // for using both

Collectives™ on Stack Overflow

How to use import statement in react?

2 Answers 2

Comments

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Linked

Related