NextJS - react-springy-parallax doesn't work

Question

I'm trying to use react-springy-parallax in my NextJS project, but whenever I want to use it, I get the following error message:

Fetch API cannot load webpack://%5Bname%5D_%5Bchunkhash%5D/./node_modules/react-dom/cjs/react-dom.development.js?. URL scheme must be "http" or "https" for CORS request.

Is this is a limitation to react-springy-parallax on NextJS?

Here is the example code I put in my index.js component:

<Parallax ref='parallax' pages={3}>
  <Parallax.Layer offset={0} speed={0.5}>
    <span>Layers can contain anything</span>
  </Parallax.Layer>
</Parallax>

It seems the problem has something to do with a CORS issue and I don't know exactly how to approach a solution to this problem.

Answer 1

I've read that this has nothing to do with NextJS in particular. After React 16.8.0 and up, I read that I have to use the useRef function.

Solution:

import React, { useRef } from 'react'
[...]
const parallax = useRef( 'parallax' )
[...]
<Parallax ref={ parallax } pages={3}>

    <Parallax.Layer offset={0} speed={0.5} onClick={ () => parallax.current.scrollTo(1) }>

        <span>Layers can contain anything</span>

    </Parallax.Layer>

</Parallax>