React 通过导入到不同的文件来使用嵌套函数

Question

父文件-speechRecognition.jsx

import { useRef } from "react";
const CharacterState = {
  Idle: 0,
  Listening: 1,
  Speaking: 2,
};

const useSpeechRecognition = () => {
  const onSpeechFoundCallback = useRef((text) => {});
  const setOnSpeechFoundCallback = (callback) => {
    onSpeechFoundCallback.current = callback;
  };

  const onMicButtonPressed = () => {
    return true;
  };

  return {
    onMicButtonPressed,
    setOnSpeechFoundCallback,
  };
};

export default useSpeechRecognition;

子文件

import useSpeechRecognition, {
  CharacterState,
} from "../apis/speechRecognition";

const {
  onMicButtonPressed,
  setOnSpeechFoundCallback,
} = useSpeechRecognition();

这是我的代码，其中我有一些内部函数，我正在子函数中导入和使用它们。 我遇到以下错误。

Experience.jsx：8未捕获的语法错误：请求的模块'/src/apis/speechRecognition.js' 不提供名为“CharacterState”的导出（在 Experience.jsx：8：3）

请检查可能是什么问题。

Answer 1

如果您想在子组件中使用在父组件中声明的函数，您只需将该函数作为 props 从父组件传递给子组件即可。