发布
社区首页 >问答首页 >如何在react中使用效果钩子?

如何在react中使用效果钩子?
EN

Stack Overflow用户
提问于 2020-07-22 20:03:30
回答 1查看 69关注 0票数 1

我想从使用钩子中返回一个使用useEffect的函数,但我收到错误消息“在既不是react函数组件也不是自定义钩子的函数中调用了useeffect。

我要做的是什么?

我有addbutton组件,当用户单击add按钮时,我想调用函数requestDialog。

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

代码语言:javascript
代码运行次数:0
复制
    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]);
     }

如何解决错误“”在既不是react函数组件也不是自定义钩子的函数中调用useEffect。“

我不知道如何使用useeffect,同时在addbutton组件中使用它。

有人能帮我一下吗。谢谢

EN

回答 1

Stack Overflow用户

发布于 2020-07-22 20:09:09

useEffect方法类似于useEffect(() => {}, []),但您在requestDialog中的用法是错误的。尝试使用以下命令进行更改。

代码语言:javascript
代码运行次数:0
复制
function requestDialog() {
  const { trigger } = usePopupContext();
  React.useEffect(() => {
    trigger(count);
  }, [count, trigger]);
}
票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/63033768

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档