Breaking News: Grepper is joining You.com. Read the official announcement!

passing props in react functional components

Pavitra Kini answered on December 23, 2021 Popularity 10/10 Helpfulness 3/10

answer passing props in react functional components

related how to pass function as a props in react in functional components

passing props in react functional components

Comment

function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}

const root = ReactDOM.createRoot(document.getElementById('root'));
const element = <Welcome name="Sara" />;
root.render(element);

Popularity 10/10 Helpfulness 3/10 Language javascript

Source: reactjs.org

Tags: javascript

Link to this answer
Share Copy Link

Contributed on Jul 14 2022

Pavitra Kini

0 Answers Avg Quality 2/10

Closely Related Answers

how to pass function as a props in react in functional components

Comment

function App() {
  const [status, setStatus] = React.useState(false);
  const [text, setText] = React.useState("");
  const handleClick = () => {
    this.setStatus(prev => ({ status: !prev.status }));
  };
  const handleChange = e => {
    this.setStatus({ text: e.target.value });
  };

  return (
    <>
      <button onClick={handleClick}>Open photo entry dialog</button>
      <ChildComponent
        isOpen={status}
        text={text}
        handleChange={handleChange}
        handleClick={handleClick}
      />
    </>
  );
}

const ChildComponent = ({ isOpen, text, handleChange, handleClick }) => {
  return (
    <>
      {isOpen && (
        <Model
          status={isOpen}
          handleClick={handleClick}
          text={text}
          handleChange={handleChange}
        />
      )}
    </>
  );
};

Popularity 10/10 Helpfulness 3/10 Language javascript

Source: Grepper

Tags: components c

Link to this answer
Share Copy Link

Contributed on Dec 23 2021

Difficult Dove

0 Answers Avg Quality 2/10

Continue with Google

By continuing, I agree that I have read and agree to Greppers's Terms of Service and Privacy Policy.

passing props in react functional components

Contents

More Related Answers

passing props in react functional components

Closely Related Answers

how to pass function as a props in react in functional components

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.