본문 바로가기

Textarea 높이 자동 조절 Textarea의 높이를 입력에 맞춰서 자동으로 변경하고 싶을 때는 아래와 같이 할 수 있습니다. .auto-height { width: 100%; } .auto-height textarea { width: 100%; resize: none; overflow-y: hidden; padding: 15px 15px 5px; line-height: 1.5; } 메모 $(document).ready(function() { $('.auto-height').on('keyup', 'textarea', function (){ $(this).css('height', 'auto'); $(this).height( this.scrollHeight ); }); $('.auto-height').find('textarea').ke.. 더보기
React 페이지 이동 Snack bar React에서 페이지 이동이 가능한 스넥바의 동작을 위하여 sanckBar.js hook을 생성 후 아래와 같은 내용을 넣어준다. import React from 'react'; import { useSnackbar } from "notistack"; import Button from "@mui/material/Button"; import {useNavigate} from "react-router-dom"; const snackBar = () => { const { enqueueSnackbar, closeSnackbar } = useSnackbar(); const nav = useNavigate(); const showSnackbar = (e) => { const action = () => { retur.. 더보기
React Class 컴포넌트에서 navigate 동작 방법 먼저 withRouter.js 라는 이름의 Hook을 생성 후 아래와 같은 내용을 입력해준다. import * as React from "react" import {useNavigate} from 'react-router-dom'; export const withRouter = (Component) => { const Wrapper = (props) => { const navigate = useNavigate(); return ( ); }; return Wrapper; }; 그 후 Class 컴포넌트 파일 안에서 아래와 같이 props의 navigate에 이동하고자 하는 페이지를 넣고 Class 컴포넌트를 withRouter로 감싸주면 된다. this.props.navigate('/login'); exp.. 더보기