Im trying to use the new relay hooks but getting this error:
import React, { Fragment, Suspense, useEffect } from 'react';
import Banner from './banner/Banner.react';
const { graphql, useQueryLoader, usePreloadedQuery } = require('react-relay/hooks');
const query = graphql`
query HomeQuery {
viewer {
id
email
...Banner_viewer
}
}
`;
const HomeContainer = () => {
const [queryReference, loadQuery] = useQueryLoader(query);
useEffect(() => {
loadQuery({});
// eslint-disable-next-line react-hooks/exhaustive-deps
}, []);
return (
<Suspense fallback="Loading...">
<Fragment>
<Home queryReference={queryReference} />
</Fragment>
</Suspense>
);
};
const Home = ({ queryReference }) => {
const data = usePreloadedQuery(query, queryReference);
console.log('data:', data);
return (
<>
<Banner viewer={data?.viewer} />
<div>HOME PAGE</div>
</>
);
};
export default HomeContainer;
Error:
usePreloadedQuery.js:38 Uncaught TypeError: Cannot read property 'fetchKey' of null
at usePreloadedQuery (usePreloadedQuery.js:38)
at Home (Home.jsx:34)
与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…