The final argument passed to useEffect changed size between renders in Next.js Typescript

Viewed 82
import dynamic from "next/dynamic"
import React, { ReactNode } from "react";
type ButtonProps = {
  type: string,
    children: ReactNode,
    onClick: () => void
}
const ButtonWrapper: React.ComponentType<{}> = dynamic(() => import('element-react').then((res: any) => { return res.Button }), { ssr: false})

export const Button: React.FC<ButtonProps> = (ButtonProps) => {
    return <><ButtonWrapper {...ButtonProps}></ButtonWrapper></>
}

I tried to implement Element-React UI to my next.js project, and I got this warning, and I want to solve it. I didn't warn when I comment this component code.

enter image description here

Does anyone know how to solve this warning?

1 Answers

The problem is in some useEffect. React detected that dependency array has changed size. To fix it you need to find that useEffect and figure out why this is happening. Check error message to find a stacktrace to the component that causes error. This seems like the error is inside the library component. In this case you need to check if it's misused or perhaps it's a bug in a library. Try searching github issues of the project.

Related