How to make vs code autocomplete React component's prop types?

Question

How to make VS Code autocomplete React component's prop types while using the component in JSX markup?

P.S.: I'm using JS, not TS.

Answer 1

for the class components you can use propTypes to do the job, you can follow this link for details -> Link

import PropTypes from 'prop-types';

class Greeting extends React.Component {
 render() {
  return (
  <h1>Hello, {this.props.name}</h1>
    );
  }
}

Greeting.propTypes = {
  name: PropTypes.string
};

Answer 2

You can also get intellisense support from PropTypes. You'll need to install prop-types

import React from "react"
import PropTypes from 'prop-types';

function Header(props) {
  return <h1>{props.headerText}</h1>
}

Header.propTypes = {
    headerText: PropTypes.string.isRequired
}

export default Header

Answer 3

There is also option to use @params definition:

/**
 * 
 * @param {{header: string, subheader: string, imageAlt: string, contentList: Array, orderLink: Object, contentLink: Object}} props 
 */
export default function JumbotronMain(props) {...}

Answer 4

I noticed that if you have a stateless component and you get the props using ES6, when you use this component, you get the props with the autocomplete.

const Stateless = ({ prop1, prop2 }) => {
  return (
    <div></div>
  )
}