728x90
리액트에서 하위 컴포넌트가 상위 컴포넌트의 함수를 실행하는 방법
상위 컴포넌트
export default function 상위 컴포넌트() {
const [isEditMode, setIsEditMode] = useState(false);
function closeEditMode() {
setIsEditMode(false);
}
return (
<하위 컴포넌트 closeEditMode={closeEditMode} />
)
}
하위 컴포넌트
export default function 하위컴포넌트({ closeEdit }) {
async function editTweet(event) {
event.preventDefault();
try {
서버로 무언가 submit
closeEdit(); 👈 이 부분이 상위 컴포넌트의 함수를 실행시킴
} catch (error) {
alert(error);
}
}
}
728x90
'React' 카테고리의 다른 글
[redux] redux는 비동기 처리를 어떻게 하고 있을까? (0) | 2022.08.13 |
---|---|
[React] 왜 컴포넌트에서는 React를 호출하는가 (0) | 2022.07.09 |
[React] 버튼에 클릭 이벤트 함수 설정하기 (0) | 2022.07.05 |
[React] 렌더링이 두 번 발생하는 이슈 (0) | 2022.06.28 |
[NextJS] 서버에서 데이터도 패치받아서 렌더링하기 (0) | 2022.01.16 |
댓글