![](/img/trans.png)
[英]How to use setInterval with react useEffect hook correctly?
[英]How to use useeffect hook in react?
我想从usehook返回一个使用useEffect的function,我收到错误“在function中调用useeffect,它既不是反应ZC1C425268E68385D14AB5074C179组件。
我想做什么?
我有 addbutton 组件,当用户单击添加按钮时,我想调用 function requestDialog。
下面是我在 addbutton 文件中的代码
function AddButton () {
const count = useGetCount();
const requestDialog = useRequestDialog(); //using usehook here
const on_add_click = () => {
requestDialog(count); //calling requestDialog here
}
return (
<button onClick={on_add_click}>add</button>
);
}
interface ContextProps {
trigger: (count: number) => void;
}
const popupContext = React.createContext<ContextProps>({
trigger: (availableSiteShares: number) => {},
});
const usePopupContext = () => React.useContext(popupContext);
export const popupContextProvider = ({ children }: any) => {
const [show, setShow] = React.useState(false);
const limit = 0;
const dismiss = () => {
if (show) {
sessionStorage.setItem(somePopupId, 'dismissed');
setShow(false);
}
};
const isDismissed = (dialogId: string) =>
sessionStorage.getItem(dialogId) === 'dismissed';
const context = {
trigger: (count: number) => {
if (!isDismissed(somePopupId) && count <= limit) {
setShow(true);
} else if (count > limit) {
setShow(false);
}
},
};
return (
<popupContext.Provider value={context}>
{children}
{show && (
<Popup onHide={dismiss} />
)}
</popupContext.Provider>
);
};
export function useRequestDialog(enabled: boolean,count: number) {
return function requestDialog() { //here is the error
const { trigger } = usePopupContext();
React.useEffect(() => {
trigger(count);
}
}, [count, trigger]);
}
如何解决错误““在 function 中调用了 useEffect,它既不是反应 function 组件或自定义挂钩。”
我不知道如何使用 useEffect 并同时在 addbutton 组件中使用它。
有人可以帮我解决这个问题。 谢谢
useEffect 方法就像useEffect(() => {}, [])
,但是您在 requestDialog 中的用法是错误的。 尝试更改以下内容。
function requestDialog() {
const { trigger } = usePopupContext();
React.useEffect(() => {
trigger(count);
}, [count, trigger]);
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.