react

React v17을 쓰다가 뒤늦게 v18 업데이트 이후에 발생한 콘솔 에러이다. 이제 ReactDom.render는 React v18에서 더이상 지원을 안한다는 내용으로 아래와 같습니다. 타입스크립트를 사용하고 있는 경우 HTML은 null 일 수 없다는 에러가 뜬다면, ! 를 사용해서 container변수값이 null이 아님을 선언이 필요하다. // Before import { render } from 'react-dom'; const container = document.getElementById('app'); render(, container); // After import { createRoot } from 'react-dom/client'; const container = document.get..

input에 휴대폰번호 (-)하이픈 자동입력 정규식 import { useState } from "react"; export default function App() { const [phoneNumber, setPhoneNumber] = useState(""); function regPhoneNumber(e) { const result = e.target.value .replace(/[^0-9.]/g, "") .replace(/^(\d{0,3})(\d{0,4})(\d{0,4})$/g, "$1-$2-$3") .replace(/(-{1,2})$/g, ""); setPhoneNumber(result); } return ( ); } 정규식 설명 // 숫자만 입력가능 .replace(/[^0-9.]/g, "") ..

*React에서 option 이름 값 가져오기 e.target.options[e.target.selectedIndex].text *예시 function Test(){ const [optionName, setOptionName] = useState(); function seleted(e: React.ChangeEvent){ setOptionName(e.target.options[e.target.selectedIndex].text) } return ( {data.map((i) => ( {i.name} )} ) } *참고사이트 https://stackoverflow.com/questions/30306486/get-selected-option-text-using-react-js