리액트 메서드 내 this 바인딩 문제
문제 Route를 사용하여 로그인 페이지에서 메인 페이지를 이동하는 구현 과정에서, 다음과 같이 withRouter를 사용하지 않고 메서드 함수 객체를 props로 넘겨 주는 방식으로 접근하였다. goMain() 메서드에서는 인자 값으로 받은 경로로 이동할 수 있도록 history 객체 props를 사용하였다. import React, {Component} from 'react'; import Login from '../Login/Login'; import {withRouter} from 'react-router-dom'; class LoginPage extends Component { goMain(path) { this.props.history.push(path); } render() { return ..
리액트 프로젝트에 웹 폰트 적용할 때 GlobalStyles의 문제점
문제 import {createGlobalStyle} from 'styled-components'; import reset from 'styled-reset'; const GlobalStyles = createGlobalStyle` ${reset}; ( ... ) @import url('https://fonts.googleapis.com/css2?family=Lobster&display=swap'); @import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400&display=swap'); ( ... ) } `; export default GlobalStyles; 어플리케이션 레벨 스타일상에서 공통 웹 폰트를 사용하기 위해 다음과 같이..