0

I am working on how to have React.js work with a backend. I have seen this syntax:

import React, {component} from 'React';

Why is {component} listed there? In my mind, you would of course want to use components. So I don't know why {component} is there.

I would think import React from 'React' would be enough... meaning "give me all of React". But obviously I am missing some sort of concept here.

Thank you.

code beginner
  • 285
  • 3
  • 14
  • not the same.i am asking why React and {Component} are both being imported from React, instead of simply importing React. It is a similar question to the one you are referencing. But it is a different question, and the difference is important. – code beginner Jun 02 '18 at 04:51

2 Answers2

3

React is the default export from the react package, whereas Component is a named export in that package. You can either do

import React from 'react';

class MyClass extends React.Component { ... }

or 

import React, { Component } from 'react';

class MyClass extends Component { ... }

Read more about JavaScript exports here

EDIT: Actually, React uses a different pattern called exposing an API on the default export, which has the same import convention as named exports - you can look at their source here

ic3b3rg
  • 14,629
  • 4
  • 30
  • 53
  • Thank you very much. I was also confused why the code was saying extends Component rather than extends React.Component. So this actually clarifies both things that were confusing me. – code beginner Jun 02 '18 at 04:54
0

Maybe because of this: class MyComponent extends Component {}. class MyComponent extends React.Component {}

In each case, you need Import React from 'react' :)

MladenB
  • 14
  • 1
  • I mean, in each case, you need `Import React from 'react'` but if you dont import `{component}`, you must write `extends React.Component` – MladenB Jun 02 '18 at 03:13