programming study/F-React, Typescript 4

20220427_react(onClick 사용법)

react - onClick 1. 버튼 눌렀을 때만 1출력되게 하고 싶을 때 import React, {useState,useEffect} from 'react'; const Test = () => { const fnTest = () => { console.log(1); } const fnTestA =() => (event) => { console.log(1); } return ( fnTest()}>버튼 눌렀을 때만 1 출력 {/* 화면 렌더링 되면서 1 출력, 버튼 동작 안 함 */} {/* 버튼 눌렀을 때만 1 출력 */} {/* fnTest(e)}>버튼 눌렀을 때만 1 출력 */} {/* fnTest()}>버튼 눌렀을 때만 1 출력 */} ); }; export default Test; 2. 객체 ..

20220420_react_useEffect

React.js useEffect useEffect( function, []?) 주로 3가지 방식으로 사용됩니다. useEffect(()=> {}); useEffect{()=> {}, []); const [name,setName] = useState('kim'); useEffect(()=> {}, [name]); 첫 번째 형태 useEffect의 가장 기본 형태 렌더링 할 때 한번 그리고 Dependency가 없기 때문에 변화가 있을 때마다 발생하기 때문입니다. 두번째 형태 useEffect를 렌더링 후 단 한번만 실행하고 싶을 때 사용합니다. 콜백 함수 뒤에 배열을 나타내는 대괄호가 있습니다. 이곳에 Dependecy를 지정합니다. 하지만 아무 변수나 값 없이 대괄호만 있다면, 이 useEffect는 ..