时间戳

首页 > 解决方案 > React - 如何控制导出/导入限制

reactjs - React - 如何控制导出/导入限制

问题描述

这可能会有点棘手，但这里什么都没有：

我有呈现组件的类，它们在类中使用一个函数。为什么不是您可能会问的方法，因为我需要其他类可以访问此方法。然而，每个函数都是特定于类的，这就是为什么我不能创建一个全局的通用辅助函数。

这是一个例子

export function generateProblem(){
   // generates a problem lol
}

ClassA {
   generateProblem();
   //does other stuff
   render()
}

export default ClassA

Class B is basically the same as Class A except generateProblem is unique to Class B

import generateProblem as gPA from "./ClassA"
import generateProblem as gPB from "./ClassB"
Class C {
   // Randomly call either gPA() or gPB();
   render()
}

我目前面临的问题是 C 类中的函数调用不起作用。我收到以下错误： Class constructor ClassA cannot be invoked without 'new' 它指向我调用函数的行

我导入/导出函数的方式有问题吗？或者 React 不允许函数/类的 2 个不同的导出语句。

附加细节 - 导出的函数使用function()符号而不是function = () => {符号，因为我听说后者没有原型或其他东西使其无法构造。

标签： reactjs

解决方案

问题是您如何导入该函数。编写时import something from "./foo"，您会从./foo. 如果你写import {something} from "./foo"，你会得到一个名为 `something.

在您的情况下，您的导入需要如下所示：

import { generateProblem } as gPA from "./ClassA"
import { generateProblem } as gPB from "./ClassB"

推荐阅读