javascript 无效的挂接调用,创建新组件时,只能在函数组件的主体内部调用挂接

kx1ctssn  于 2023-02-11  发布在  Java
关注(0)|答案(2)|浏览(133)

当我尝试从外部组件创建一个"Question"类型的元素时,如下所示:

const current = Question();

作为问题组件,如下所示:

export const Question = () => {

    const [text, setText] = useState("None");

    return (
        <>
        <div className="row">
            <div className="col-12 col-md-9 col-lg-10 col-xl-10 col-xxl-10">
                <span>{text}
                </span>

             </div>
        </div>
        </>
    )
}

当我尝试创建该Question对象时,它返回以下错误:

Uncaught Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:
1. You might have mismatching versions of React and the renderer (such as React DOM)
2. You might be breaking the Rules of Hooks
3. You might have more than one copy of React in the same app

会发生什么?我不是从JS函数调用钩子。
谢谢。

zzlelutf

zzlelutf1#

不要尝试直接调用组件函数,而是使用JSX:

const current = <Question/>;
oyxsuwqo

oyxsuwqo2#

如果你想使用另一个文件中的组件,你需要使用import:
导出常量问题=()=〉{常量[文本,设置文本] =使用状态(“无”);

return (
    <>
    <div className="row">
        <div className="col-12 col-md-9 col-lg-10 col-xl-10 col-xxl-10">
            <span>{text}
            </span>

         </div>
    </div>
    </>
)

}
使用导入:

import {Question } from "here you need to put the path shod look like './Question  ' or ../components/Question"

我能帮上忙

相关问题