在React

Question

在file1.js中：

const doSomething = () => {
  console.log('yay');
};

export { doSomething }; //simplified, not using export default due to multiple exports

在file2.jsx中：

import { doSomething } from './file1.js';

doSomething(); //undefined 

暂时尝试解决此问题。试图从一个类中导入此方法，并将其添加为组件的onClick，但始终未定义。帮助将不胜感激

edit1：固定导入简化代码

Answer 1

您可以尝试一下。 像这样在file2.js中导入file1.js

import * as demo from './file1.js';

并像这样调用您的函数

demo.doSomething()

Answer 2

问题是您正在调用不会返回任何内容的函数。

如果您执行console.log(doSomething())， 您将获得这样的日志。

yay //you called a functions its executed
undefined // you called a function which will not return anything

第一个日志来自doSomething file1.js文件。

第二个日志来自file2.jsx

Answer 3

将函数表达式更改为函数声明。函数声明由解释器在应用程序启动之前创建。

函数表达式创建一个等于 undefined 的变量。

• 如果 file2 在 file1 之前执行，则 doSomething 变量未定义。
• 如果 file1 在 file2 之前执行，doSomething 变量是函数的链接。

Answer 4

fil1.js

export const doSomething = () => {
    console.log('yay');
};

file2.js

import { doSomething } from './file1.js';

doSomething();