Eventos - Mllara/react-project GitHub Wiki
-Os eventos de React são os mesmos eventos do DOM;
-Ou seja, temos eventos para responder a um click;
O evento é atrelado a uma tag que irá executá-lo;
-Geralmente um método é atribuído ao evento;
-Este método deve ser criado no componente;
Na prática:
->Criar um arquivo na pasta components de Eventos.js:
function Evento ({numero}){
function meuEvento(){ //cria um método com o mesmo nome do evento
console.log(`Opa, fui ativado! ${numero}`)
}
return(
<div>
<p>Clique para disparar um evento:</p>
<button onClick={meuEvento}>Ativar!</button> // onclick faz "alguma coisa" e geralmente é uma função. Para não invocação a função primeiro do clique, a função é criada fora do return
</div>
)
}
export default Evento
****** Na pasta App.JS
import './App.css';
import Evento from './Components/Eventos'
function App() {
const nome = 'Maria'
return (
<div className="App">
<h1>Testando Eventos</h1>
<Evento numero="1"/> // componente do Evento
<Evento numero="2"/>
</div>
);
}
export default App;