/Javascript/React/Type '{ GlobalState: any; Dispatch: React.Dispatch<any>; }' is not assignable to type 'null'

Type '{ GlobalState: any; Dispatch: React.Dispatch<any>; }' is not assignable to type 'null'

Type '{ GlobalState: any; Dispatch: React.Dispatch; }' is not assignable to type 'null'

Since we have the useReducer hook, most of the time we do not need to use redux, or any other redux-like libraries.

To fix the issue with types, you need to define a ContextType.
===========
interface ContextType {
  state: {
    searchFilter: string[];
    dataRows: DataRow[];
  };
  dispatch: React.Dispatch<{ type: string; value: unknown }>;
}
========
To create your store context you can use the following. (We allow it to be null, so we do not have to deal with initial value when creating the context. The consumer will need to make sure that the context has been defined - see few lines below)
===============
const store = createContext<ContextType | null>(null);
===============
You can then create your useStore hook to access data from the store.
============
function useStore() {
  const value = React.useContext(store);
  if (!value) throw new Error("useStore needs to be within StateProvider");
  return value;
}

Source: stackoverflow.com

Similar codes

32 votes231 views5 answers
React disable eslint errors
Javascript React
0 vote249 views1 answer
Remove duplicate value from map react js
Javascript React
1 vote226 views1 answer
React native componentwillmount vs componentdidmount
Javascript React
0 vote244 views1 answer
ReactRender
Javascript React
71 votes299 views5 answers
Css react
Javascript React
4 votes217 views2 answers
React helmet
Javascript React
69 votes248 views6 answers
React route
Javascript React
1 vote226 views5 answers
React date picker
Javascript React
0 vote247 views1 answer
Horizontal scrollview in react js
Javascript React
1 vote189 views1 answer
Hide column in antd table using js / react with conditional rendering
Javascript React