“Las funciones de pasar como accesorios en React” Código de respuesta

Cómo pasar la función como accesorios en React en componentes funcionales

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}
        />
      )}
    </>
  );
};
Difficult Dove

Las funciones de pasar como accesorios en React

const Banner = props => {
  const name = props.name
  return (
    <div>
      <p>Hello {name}</p>
      <button onClick={props.clickHandler}>Click Me</button>
    </div>
  )
}

function App() {
  const showAlert = () => {
    alert("Welcome!")
  }
  return (
    <div>
      <Banner name="Ranjeet" clickHandler={showAlert} />
    </div>
  )
}

export default App
Outrageous Ostrich

Respuestas similares a “Las funciones de pasar como accesorios en React”

Preguntas similares a “Las funciones de pasar como accesorios en React”

Más respuestas relacionadas con “Las funciones de pasar como accesorios en React” en JavaScript

Explore las respuestas de código populares por idioma

Explorar otros lenguajes de código