Question

我是js的新手，因此会做出反应，

我尝试导出js函数：

App.js：

import React from 'react';
import logo from './logo.svg';
import './App.css';
import { render } from 'react-dom';
import { LazyLog } from 'react-lazylog';    
import 'bootstrap/dist/css/bootstrap.min.css';
import { Dropdown  } from 'react-bootstrap';
import {ApiRequests} from './ApiRequests'


var textConst="";
var lines=ApiRequests.GetMockLogLines();
textConst=lines;

还有ApiRequests.js：

export function GetMockLogLines()
{
 let logs=[""]
 return logs;
}

所以，当我编译js（我的天哪）时，它使我很沮丧：

Attempted import error: 'ApiRequests' is not exported from './ApiRequests'.

当我将其更改为：

 import ApiRequests from './ApiRequests'

->

 Attempted import error: './ApiRequests' does not contain a default export (imported as 'ApiRequests').

所以，我只想从另一个文件中获取功能。我做错了什么？

{}与没有{}有什么区别？（您可以给我发送开始阅读的链接，请）。

Answer 1

文件中没有名为Apirequests的函数。您要导出的函数为GetMockLogLines()

因此您的导入应为

import {GetMockLogLines} from './ApiRequests'

关于{}和不带花括号的导入差异，是如何从文件中导出内容。有两种类型的导出-默认导出和命名导出。每个文件只能有一个默认导出，并且必须在没有花括号的情况下导入。

您可以在此处了解更多信息-https://medium.com/@etherealm/named-export-vs-default-export-in-es6-affb483a0910

Answer 2

您需要直接导入GetMockLogLines，因为它是命名导入。将您的代码更改为以下内容。

import { GetMockLogLines } from './ApiRequests'
var lines=GetMockLogLines();

尝试导入错误：“ ./ ApiRequests”未导出“ ApiRequests”

2 个答案: