Проблема при экспорте функции из другого файла в react

Я определил функцию в файле, но когда я экспортирую и пытаюсь получить доступ к возвращаемому значению, у меня возникает неопределенная ошибка.

Вот моя функция:

export default function produits(){
  return [{nom:"chaussure",prix:45}, {nom:"polo",prix:8}]
}

Когда в другом файле я делаю

import {produits} from './mesprod.js

и я не знаю, почему я получаю эту ошибку. Но я только что попытался изменить строку экспорта моей функции, удалив ключевое слово default, тогда все идет нормально. Так в чем разница между

export default function functionName()

а также export function functionName()

а также

export default function()

и я действительно не понимаю, как использовать { } при импорте модуля, хотя я использую его все время. Я новичок в React js

2
1
564
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Когда вы выполняете экспорт по умолчанию, вам необходимо удалить фигурные скобки вокруг импорта.

Вот так:

import produits from './mesprod.js'

Фигурные скобки используются всякий раз, когда вы импортируете «именованный» экспорт. Когда вы выполняете экспорт по умолчанию, вы можете назвать экспорт по умолчанию как хотите, когда вы импортируете его как таковой. То есть уже не важно, какое имя было в исходном файле.

Ответ принят как подходящий

Когда вы делаете экспорт по умолчанию

Вы должны импортировать это как

  import produits from './mesprod.js'

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

Когда нужно использовать фигурные скобки

Скажем, предположим, что вы экспортируете одну функцию, используя значение по умолчанию, а две другие - без значения по умолчанию.

mesprod.js

   export default function produits (){return [{nom:"chaussure",prix:45}, {nom:"polo",prix:8}]}

   export function produits1(){return [{nom:"chaussure",prix:45}, {nom:"polo",prix:8}]}

   export function produits2(){return [{nom:"chaussure",prix:45}, {nom:"polo",prix:8}]}

Итак, при импорте вы делаете как показано ниже

  import produits, { produits1, produits2 } from './mesprod.js'

Фигурные скобки используются, когда вы экспортируете несколько функций без ключевого слова по умолчанию, и если вы экспортируете со значением по умолчанию, импортируйте его без фигурных скобок.

Другие вопросы по теме