Javascript 如何使用react在函数中调用usehook？

我想从usehook返回一个使用

useffect

的函数，我得到了这个错误…

useffect在既不是react函数组件也不是自定义挂钩的函数中调用。

我想做什么？

我有addbutton组件，当用户单击add button时，我想调用函数

requestDialog

下面是我在addbutton文件中的代码

功能添加按钮（）{
const count=useGetCount（）；
const requestDialog=useRequestDialog（）；//在此处使用usehook
在添加时单击=（）=>{
requestDialog（计数）；//在此处调用requestDialog
}
返回(
添加
);
}
界面上下文道具{
触发器：（计数：数字）=>无效；
}
const popupContext=React.createContext({
触发器：（AvailablesItemShares:number）=>{}，
});
const usePopupContext=（）=>React.useContext（popupContext）；
export const popupContextProvider=（{children}:any）=>{
const[show，setShow]=React.useState（false）；
常数极限=0；
const dismise=（）=>{
如果（显示）{
setItem（somePopupId，'disposed'）；
设置显示（假）；
}
};
const isDismissed=（dialogId:string）=>
sessionStorage.getItem（dialogId）==“已解除”；
常量上下文={
触发器：（计数：数字）=>{
如果（！isDismissed（somePopupId）&计数限制）{
设置显示（假）；
}
},
};
返回(
{儿童}
{show&&(
)}
);
};
导出函数UserRequestDialog(
已启用：布尔，
计数：数字
) {
返回函数requestDialog（）{//错误如下
const{trigger}=usePopupContext（）；
React.useffect（（）=>{
触发器（计数）；
}
}，[计数，触发器]；
}

如何在

useRequestDialog

中修改此代码，以便在此处调用

useffect

---

有人能帮我吗？谢谢。

useEffect钩子需要位于返回的外部，因为它允许您在功能组件的返回之外执行其他操作。React文档中的示例展示了一个很好的示例：

因此，对于您的示例，它看起来像：

const useRequestDialog = ({...}) => {

 React.useEffect(() => {
    trigger(count);
 }, [count, trigger]);

 return {...}

const requestDialog = (count) => {
   const x = something(count);
   return x;
}

const AddButton = () => {
   const count = useGetCount();
   const handleClick = ()  => {
      requestDialog(count);
   }

   return (
      <button onClick={handleClick}>add</button>
   );
}

但是，如果您只想调用requestDialog函数，您可以执行以下操作：

const useRequestDialog = ({...}) => {

 React.useEffect(() => {
    trigger(count);
 }, [count, trigger]);

 return {...}

const requestDialog = (count) => {
   const x = something(count);
   return x;
}

const AddButton = () => {
   const count = useGetCount();
   const handleClick = ()  => {
      requestDialog(count);
   }

   return (
      <button onClick={handleClick}>add</button>
   );
}

const requestDialog=（计数）=>{
常数x=某物（计数）；
返回x；
}
常量AddButton=（）=>{
const count=useGetCount（）；
常量handleClick=（）=>{
请求对话框（计数）；
}
返回(
添加
);
}

如果我正确理解了常规函数中不能调用钩子的原因，那么它们必须是react函数组件。