NextJS-react-springy-parallax不起作用

时间:2019-05-30 04:05:10

标签: next.js

我试图在自己的NextJS项目中使用react-springy-parallax,但是每当我想使用它时,都会收到以下错误消息:

  

Fetch API无法加载webpack://%5Bname%5D_%5Bchunkhash%5D/./node_modules/react-dom/cjs/react-dom.development.js?。要进行CORS请求,URL方案必须为“ http”或“ https”。

这是对NextJS上react-springy-parallax的限制吗?

这是我放在index.js组件中的示例代码:

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

问题似乎与 CORS 问题有关,我不知道该如何解决该问题。

1 个答案:

答案 0 :(得分:0)

我已经读到,这与NextJS无关。在React 16.8.0及更高版本之后,我读到我必须使用useRef函数。

解决方案:

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>