[Solved] Property 'children' does not exist on type 'IPageProps' - React 18

React JS Faysal Shuvo

Problem: 

I was using the old react version for my project but I had to upgrade to react 18. After updating it seems every component that uses children is throwing errors. 

Property 'children' does not exist on type 'IPageProps'.

Before this update, every children props were included in the FC interface but now I have to manually add children: ReactNode. 

So in this article, we are going to solve the property 'children' does not exist on type 'IPageProps' in React 18 - this problem.


Solution: 

In the new update, they removed the implicit children in React.FunctionalComponent type. You can learn more about it here. 

This is how you solve this:

Before: 

import * as React from 'react';
type Props = {};
const Component: React.FC<Props> = ({children}) => {...}

After: 

import * as React from 'react';
type Props = {
  children?: React.ReactNode
};
const Component: React.FC<Props> = ({children}) => {...}

children are a regular prop in React. It is not something special. Like all other props, you need to define the children. 


Hope this solves your problem. If you have any more confusion comment below.