목록웹 개발 (224)
dukDukz
import React from "react"; import { Routes, Route, Link, Navigate } from "react-router-dom"; import Home from "./pages/Home"; import Login from "./pages/Login"; function NoMatch() { return ( 페이지를 찾을 수 없습니다. 홈으로 ); } function Router() { return ( ); } export default Router; 1. '/' 로 들어왔을때 '/login' 으로 자동이동함. 2. 없는 링크로 접근하는 경우 NoMatch 를 리턴함.
https://kimsfamily.kr/342 13. 리믹스 솔리디티 8.0 버전 ERC20토큰 만들기 1. 스마트 계약의 시작, 리믹스 도구 사용해보기 2. 솔리디티 개발환경 구성 3. 스마트컨트랙트 작성 후 배포하기 4. openzeppelin 사용하여 ERC20 토큰 만들기 5. Ropsten 테스트넷에 ERC20토큰 배포하기 6. kimsfamily.kr 위의 블로그와 동일하게 작업하고 토큰이름과 토큰심볼만 넣어서 ERC20 발행함 발행된 것을 확인 할 수 있음. https://testnet.bscscan.com/address/0x662030dad5325d879a7482717852c38981f427d5 Contract Address 0x662030dad5325d879a7482717852c38981..
Uncaught Error: Invariant failed: You should not use outside a https://hellowworlds.tistory.com/62 [React.JS] Error: Invariant failed: You should not use outside a 해결 방법 Error: Invariant failed: You should not use outside a 오류 : 불변 실패 : 외부에서 를 사용해서는 안됩니다. 음.. 이 오류가 발생한 이유는 태그로 전체를 감싸주지 않았기 때문이다. 감싸.. hellowworlds.tistory.com "react-router-dom": "^5.3.0", 6.x.x 버전부터는 switch를 사용하지 않음
import { Switch, Route, Redirect } from "react-router-dom"; 이렇게 Switch 안에서 Route와 Redirect 를 사용하게 된다. Redirect는 어떻게 활용하나? 여기서는 '/' 링크로 왔을때 '/dashboard'로 이동하게끔 했다. 다른 예시로는 isLogin = true 일때 '/' 로 isLogin = false 일때 '/login'으로 가게하는 방법도 많이 쓰인다. https://velog.io/@wlsdnjs156/ReactRouter-Redirect React[Router] - Redirect Redirect는 react-router-dom에서 import해서 사용 합니다.Redirect 컴포넌트는 랜더링되면 to로 지정된 경로로 이동 ..
Route 에서 render와 component가 있는데 무슨 차이일까..? props를 넘기고 싶을 때 불필요하게 컴포넌트를 다시 마운트하지 않기 위해서 render를 사용한다. https://zereight.tistory.com/976 React Router의 render와 component 차이 React Router의 render와 component 차이 출처 React에서는 Route 를 사용해서 라우팅을 할 수 있다. Route 태그에서 내가 원하는 URI로 이동하게 되면, 어떤 컴포넌트를 렌더링할 것인가를 정할 수 있다. 예를 zereight.tistory.com
보호되어 있는 글입니다.
1. xlsx 설치 yarn add xlsx 2. 엑셀 파일 다운로드 구현 import * as XLSX from "xlsx"; const ExcelDownload = () => { ... // 다운로드 할 엑셀 데이터 const [excelDownloadData, setExcelDownloadData] = useState({}); // API를 통해 다운로드 할 엑셀 데이터를 받아온다. [React-Query] const onSuccessGetExcelData = (data) => { setExcelDownloadData(data.excelData); }; const onErrorGetExcelData = (error) => { console.log(error); }; const { refetch: g..
여러 방법이 있겠지만 이번에는 localStorage 에 저장하는 방식을 이용했다. (블로그 참고) 1. 검색 시 저장 const onSubmit = () =>{ // 검색조건유지 setLocalStorage("searchCondition", inputs); } 검색 버튼을 눌렀을때 검색 조건들을 searchCondtion 이란 이름으로 localStorage에 저장한다. 2. 값 초기화 시 저장된 값 삭제 const onErroronGetInvoiceList = () => { // 검색조건유지초기화 localStorage.removeItem("searchCondition"); }; 3. 검색조건 유지 const searchCondition = getLocalStorage("searchCondition"..