aleph.js icon indicating copy to clipboard operation
aleph.js copied to clipboard

Problems with React.forwardRef

Open hazae41 opened this issue 4 years ago • 1 comments
trafficstars

Hey, I face multiple errors when I use React.forwardRef

Here is my code

export const ProfileModal = forwardRef((props: {
  disconnect: () => void
}, ref: Ref<Openable>) => {
  // ...
})

The first error is that the compiled .js file modifies the "ProfileModal" variable, which is a const

Capture

I modify the script to use "let"

export let ProfileModal = ...

But then another error occurs, from the component that includes the modal

Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports

const Home = () => {
  // ...

  return <>
    <ProfileModal ... />
    <... />
  </>
}

When logging ProfileModal value, it shows undefined

const Home = () => {
  // ...

  console.log("profile modal", ProfileModal)

  return <>
    <ProfileModal ... />
    <... />
  </>
}

hazae41 avatar Feb 09 '21 18:02 hazae41

Possibly a problem with the esm.sh conversion of React but I am not sure.

shadowtime2000 avatar Feb 19 '21 02:02 shadowtime2000