전체보기66 React에 데이터 받아오기 port : http://localhost:3000/ path= "/" 사진과 같이 h2 에서 데이터를 받아보자 데이터를 받아올 때에는 fetch 또는 axios를 사용할 수 있는데 여기서는 fetch를 사용해본다. # 전체 코드 const Home = () => { const [books, setBooks] = useState([]); //함수 실행시 최초 한번 실행되는 것 useEffect(() => { fetch('http://localhost:8091/book', { method: 'GET', }) .then((res) => res.json()) .then((res) => { console.log(1, res); setBooks(res); }); //비동기 함수 }, []); return ( 책 .. 2022. 8. 16. Generic <?> - 제네릭 와일드 카드 제네릭을 사용하는 이유가 데이터 형식에 의존/영향받지 않고 하나의 코드 구현으로 여러 데이터 타임들을 다루기 위해서이다. 암묵적으로 아래의 표대로 사용이 된다. 암묵적이라는 말 그대로 굳이 저렇게 사용안하고 마음대로 정해 사용해도 무관하다. 하지만 나처럼 이마저도 귀찮아서 더욱 간편한 것을 바라는 마음이 생기기도 한다. 이 경우 사용할 수 있는게 "와일드 카드 "이다 이름만 보면 되게 생뚱맞지만 이것은 아주 유용한 아이이다. 안에 ?를 넣어 사용하는데 이렇게 하면 모든 클래스나 인터페이스 타입이 올 수 있다. 즉 아무거나 넣으면 된다. 예시코드를 보여주겠다. @PutMapping("/book/{id}") public ResponseEntity update(@PathVariable Long id, Book.. 2022. 8. 15. 배열/함수들 배열 - var city = []; + 길이 설정 x - 배열 데이터 값이 0이면 삭제됨 join() - city.join(); ==> 데이터들을 콤마로 연결 - city.join('-') ==> 데이터들을 -로 연결 concat() - data.concat( 데이터3); ==> 괄호안의 것과 data 연결 reverse() - data.reverse() sort() - 주의: 자릿수가 다른 숫자들은 다르게 처리를 해줘야한다. slice(a,b) - a부터 b 전까지 인덱스 값의 데이터들을 반환 splice(a,b) - a 부터 b 인데스에 위치한 데이터를 잘라냄 나머지는 잘라진채 남겨짐 - splice(2,5,"사람","인간") + 인덱스 2부터 5까지 잘라내고 사람,인간 추가 - splice(2,Nu.. 2022. 6. 24. 변수 - var, let, const var - 블록 안에서도 전역 변수처럼 여겨진다 - 재선언 가능, 재할당 가능(중복 주의) let - 선언, 초기화 분리되서 진행 - 재선언 불가, 재할당 가능 cosnt - 선언, 초기화 동시에 - 재선언 불가, 재할당 불가 - 객체 생성해서 재할당 가능 let, const - 블록 레벨 스코프를 따른다 2022. 6. 24. 이전 1 ··· 4 5 6 7 8 9 10 ··· 17 다음 반응형
