Accepted answer

You need to provide the interfaces/type aliases so that TypeScript will know the typings of state.

After creating the interface for state, you will need to provide the interface as the generics for useState.

To solve the 2nd issue, you will need to provide the key props to each item of the <li> element

interface StateProperties {
  name: string;
  age: number;

function App() {
  const [state, setState] = useState<StateProperties[]>([]);

  // do the rest

return (
  <div className="App">
    {{ name, age }) => {
      return <li key={`${name}-${age}`}>{name}</li>; //FROM HERE ERROR IS COMING


Related Query

More Query from same tag