Coding⏱️ 2 min read📅 2026-05-29

How to Fix: How do I pass props to a function component in TypeScript? I am receiving a

Pass props to a function component in TypeScript by using the correct type and syntax.

Quick Answer: Use the correct type for the props, such as { activeHeader: boolean; activeMenu: boolean; } instead of just boolean.

To fix the error, you need to change the type of the props in your function component from a single boolean value to an object with two properties. You can do this by using the `&` operator to specify multiple types.

💡 How to Change the Type

  • Change `MobileHeader` to `(activeHeader: boolean, activeMenu: boolean) => Element` in your component definition.

🚀 Example

Example Usage

  1. Change the props type to an object with two properties: `MobileHeader({ activeHeader, activeMenu }: { activeHeader: boolean; activeMenu: boolean }) => Element`

✨ Wrapping Up

By making this change, you can pass props to your function component and resolve the error.

Did this fix your problem?

If not, try searching for specific error codes.

🔍 Search Error Database

❓ Frequently Asked Questions