Más React

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
import logo from './logo.svg';
import './App.css';
const Saludo = ({nombre,apellidos="",edad=0}) => {
  console.log(nombre,apellidos,edad)
  return <h1>Hola {nombre+" "+apellidos}, qué tal?</h1>;
}
const gestionarClick = (evt) => {
   
  console.log("clickado",evt);
}
const Despedida = () => {
  let tipo = "compañero"
  return (
    <>
      <h2  onClick={gestionarClick} className='destacado'>Adios {tipo.toUpperCase()}</h2>
      <p >Nos vemos otro día</p>
      <br />
      <img onClick={gestionarClick} className='App-logo' src={logo} />
    </>
  );
}
function App() {
  return (
    <div className="App">
      <Saludo nombre="Juan" apellidos="Pérez" edad="30" />
      <Despedida />
      <Saludo nombre="Ana" />
    </div>
  );
}
 
export default App;

Publicado por

Juan Pablo Fuentes

Formador de programación y bases de datos