在函数中反应常量答案

【问题标题】：React Constants inside a Function在函数中反应常量
【发布时间】：2021-08-21 13:09:32
【问题描述】：

我需要帮助来导出常量。当我尝试在 google 或 stackoverflow 的其他相关主题上搜索此内容时，我遇到了不同的错误。

这是我的 Printer.jsx

import React, { useRef, useState } from "react";


// export individual features (can export var, let,
// const, function, class)
export let ePosDev = new window.epson.ePOSDevice();
export const ePosDevice = useRef();
export const printer = useRef();

export function connectFunction() { 
  ePosDevice.current = ePosDev;
  ePosDev.connect("192.168.1.254", 8080, (data) => {
  if (data === "OK") {
    ePosDev.createDevice(
      "local_printer",
      ePosDev.DEVICE_TYPE_PRINTER,
      { crypto: true, buffer: false },
      (devobj, retcode) => {
        if (retcode === "OK") {
          printer.current = devobj;
        } else {
          throw retcode;
        }
      }
    );
  } else {
    throw data;
  }
}); };

我需要将 const 连接添加到 App.js 以便如果应用程序正在启动连接也正在启动。第二个是我需要将 const print 添加到 ReactB.js-file 中，因此如果 ReactB.js-page 的内容正在加载，则应该发送打印请求。

感谢您的帮助！卡在这个问题上已经 5 个小时了，不知道如何处理这个问题。

【问题讨论】：

你要导出什么？
@EdwinDijasChiwona 我想导出 const connect 和 const print。我不知道该怎么做。
您是否有理由将 Printer() 导出为默认值？我不确定您要解决的确切问题，但您可以完全删除 Printer() 函数，并直接导出 connect() 和 print() 函数。然后在您的 app.js 中，您只需从 './printer.js' 导入 { connect } 并在需要的地方使用 connect()。
@roadrunner343 你能帮我做这件事吗？我尝试过这种方式，但收到此错误：“无效的挂钩调用”
它需要是.JSX 组件吗？我在 Printer.jsx 中没有看到任何返回 JSX 的内容。在我看来，它应该只是一个标准的 .js utils 文件。在这种情况下，您可以定义两个不同的函数（一个用于连接，一个用于打印）并导出它们，就像您现在使用 Printer() 一样。如果你想导出常量，你只需要在它们被定义后导出它们 export { constName };

标签： javascript reactjs constants export

【解决方案1】：

看来您的主要问题在于如何导出常量。我建议查看 MDN 了解更多信息：https://developer.mozilla.org/en-US/docs/web/javascript/reference/statements/export

以下是与您的场景相关的命名导出的摘录。

// export features declared earlier
export { myFunction, myVariable };

// export individual features (can export var, let,
// const, function, class)
export let myVariable = Math.sqrt(2);
export function myFunction() { ... };

因此，对于您的示例，只需添加使用 export const connect = value; 声明 const 或在声明后添加 export { connect }; 即可。

【讨论】：

谢谢，但这并不能帮助我解决这个问题：错误：无效的挂钩调用。钩子只能在函数组件的主体内部调用。这可能是由于以下原因之一：
当我从这个开始时：export const ePosDevice = useRef();导出常量打印机 = useRef();然后导出函数 connectFunction() { } 我收到此错误
我更新了我的代码，请快速查看...# @roadrunner
您需要重新评估您正在尝试做的事情以及原因 - 就像我在 cmets 中对您的原始帖子所说的那样，从我现在所看到的情况来看，我认为 Printer 没有理由成为 React组件，并且您只能在反应组件中使用 reactHooks。摆脱 useRef() 钩子并将您需要的任何值存储在变量中。就像我之前提到的，离开 React 并首先学习 JS 基础知识对你来说是非常有益的。