how to get value from reactjs customhook?

Question

I have a CustomHook something like this

import React from 'react';

export default function usePersistedState(key, defaultValue) {
  const [state, setState] = React.useState(() => {
    const persistedState = localStorage.getItem(key);
    return persistedState ? persistedState : defaultValue;
  });
  React.useEffect(() => {
    window.localStorage.setItem(key, state);
  }, [state, key]);
  return [state, setState];
}

i am storing some token information

 usePersistedState('authentication', keycloak.token);

Now in service class i want to get the saved information function GetToken(props) { const token = usePersistedState(props,'test'); return token; }

Same service class have

function getAll(pageNo, limit){
    return httpClient({
        url: `api/posts?page=${pageNo}&limit=${limit}`,
        method: 'GET',
        headers: {
          'Content-type': 'application/json',
          'Authorization': 'Bearer ' +GetToken('authentication'),
          'Access-Control-Allow-Origin': '*'
      },
    });
}

But its failing .What is wrong with code and how to access the save data from custom hook?

Answer 1

You can not use hook in a normal function, it can only be run in a function which return a React element or an HOC.