How to solve calling hooks conditionally here?
I have this
data
coming from
validateData
that returns some data if valid otherwise
null
. I then check if
data
exists and return early otherwise. After that I use
useCustomHook
that depends on that
data
but because I returned early I get a warning that hook is called conditionally. How can I avoid this issue?
const MyComponent: FC<Props> = ({ rawData }) => {
const data = validateData(rawData);
if (!data) return null;
const someOtherData = useCustomHook(data.something);
return <div>{data.something}</div>;
};
export default MyComponent;