기술 블로그

import axios from 'axios'; import { useQuery } from 'react-query'; const fetchSuperHero = (heroId) => { return axios.get(`http://localhost:4000/superheroes/${heroId}`); }; export function useSuperHeroesData(heroId) { return useQuery(['super-hero', heroId], () => fetchSuperHero(heroId)); }​ const { refetch } = useQuery( 'super-heroes', fetchSuperHeroes, { enabled: false, }, ); return ( RQ Super H..

yarn add react-query import axios from 'axios'; import React from 'react'; import { useQuery } from 'react-query'; function RQSuperHeroes() { useQuery('super-heroes', () => { return axios.get('http://localhost:4000/superheroes'); }); return RQSuperHeroes; } export default RQSuperHeroes; useQuery(쿼리키, 프로미스를 리턴하는 콜백함수,{옵션}) 와 같이 기본 구조를 가진다. 인자값 중 쿼리키와 프로미스를 리턴하는 콜백함수는 v4에서 옵션 객체의 queryKey와 queryFn..

프로토타입 기반 상속 js에서 모든 객체는 다른 객체를 프로토타입으로 가진다. // 부모 생성자 함수 function Parent(name) { this.name = name; } // 부모 메서드 추가 Parent.prototype.sayHello = function() { console.log(`Hello, I'm ${this.name}`); }; // 자식 생성자 함수 function Child(name, age) { Parent.call(this, name); // 부모 생성자 호출 this.age = age; } // 프로토타입 체인 설정 Child.prototype = Object.create(Parent.prototype); Child.prototype.constructor = Chi..