Получение ошибки "тип элемента недопустим, ожидается строка" при импорте компонента в React Native

Question

Есть ли разница между import Component из 'react' или import React, {Component} из 'react' ? Я получаю эту ошибку тип элемента недопустим, ожидается строка , если я поставлю этот import import React, {Component} из 'response' , но если я перейду на другой, все в порядке. Есть какие-нибудь проблемы с этим? Спасибо. Я новичок в кодировании.

Answer 1

Что я делаю:

import React, {Component} from 'react';

, тогда вы можете использовать его в классе, например:

class Login extends Component

использование {Component} не что иное, как деструктуризация импорта,

Например, если бы вы сделали:

 import React, {Component} from 'react';

, тогда вы бы использовали его как:

class Login extends React.Component

Вот в чем разница, надеюсь, это поможет.

Не стесняйтесь сомневаться

Answer 2

Компонент по умолчанию не экспортируется из react, поэтому вам нужно импортировать его с деструктуризацией

Answer 3

import Component from 'react'

совпадает с

import React from 'react'

, потому что вы импортируете экспорт по умолчанию для пакета React и можете назвать его так, как вы sh.

import React, { Component } from 'react'

Этот «Компонент» относится к React.Component, вы импортируете «Компонент» из 'react' плюс экспорт по умолчанию.

представьте, что у вас есть файл с несколькими экспортами с именем exports. js

const DefaultExport = () => null

export const OtherExport = () => null
export const AnotherExport = () => null

export default DefaultExport

Вы можете импортировать свой компонент, используя

import something from './exports' //this is DefaultExport
import { OtherExport } from './exports' //OtherExport
import { AnotherExport as RandomExport } from './exports' //AnotherExport
import * as Exports from './exports' //you are importing all the exports

в последнем случае import * as Exports from './exports' вы можете получить доступ и использовать все экспорты из файла, например

Exports.default //refer to default export
Exports.OtherExport //refer to OtherExport
Exports.AnotherExport //refer to AnotherExport