CODEWITHSUNDEEP
javascriptreactjstypescript
Rohit chauhan
Rohit chauhan

Reputation: 167

Error when passing parameters in components in react using Typescript

When I pass the value parameter from App component to App2 component in react using typescript, it is giving an error 

Property 'value' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<App2> & Readonly<{ children?: ReactNode; }> & Read...

The code of App.tsx is 

import * as React from "react";
import './App.css';
 import App2 from './App2';


class App extends React.Component<any,any>{

  public render(){
    return(
      <div>
          <h1>
            <App2 value = {5}/>
          </h1>
        </div>
    )
  }

}
export default App;

and the code of App2 component is :-

import * as React from "react";


class App2 extends React.Component{

    public render(){
        return(
            <div>
            <h4>Hello world</h4>
           </div>

        )
    }
}
export default App2;

Upvotes: 5

Views: 163

Answers (1)

Titian Cernicova-Dragomir
Titian Cernicova-Dragomir

Reputation: 250036

You need to specify the type for the properties to tell the compiler what properties are valid on the App2 component and what their types are:

class App2 extends React.Component<{ value: number }>{

  public render() {
    return (
      <div>
        <h4>Hello world</h4>
      </div>

    )
  }
}

Upvotes: 3

Related Questions