1 useEffect(() => {
2 return () => {
3 console.log("cleaned up");
4 };
5 }, []);
1useEffect( () => console.log("mount"), [] );
2useEffect( () => console.log("will update data1"), [ data1 ] );
3useEffect( () => console.log("will update any") );
4useEffect( () => () => console.log("will update data1 or unmount"), [ data1 ] );
5useEffect( () => () => console.log("unmount"), [] );
6
1 useEffect(() => {
2 return () => {
3 console.log("cleaning up --> unmount ");
4 };
5 }, []);
6
1import React, { useState, useEffect } from 'react';
2function Example() {
3 const [count, setCount] = useState(0);
4
5 // Similar to componentDidMount and componentDidUpdate:
6 useEffect(() => {
7 // Update the document title using the browser API
8 document.title = `You clicked ${count} times`;
9 });
10
11 );
12}
1useEffect( () => console.log("mount"), [] );
2useEffect( () => console.log("will update data1"), [ data1 ] );
3useEffect( () => console.log("will update any") );
4useEffect( () => () => console.log("will update data1 or unmount"), [ data1 ] );
5useEffect( () => () => console.log("unmount"), [] );
1useEffect(() => {
2 messagesRef.on('child added', snapshot => {
3 const message = snapshot.val();
4 message.key = snapshot.key;
5
6 setMessages(messages.concat(message)); // See Note 1
7}, []); // See Note 2