React3 [회원가입] 정규 표현식과 아이디 일치 불일치 React import axios from "axios"; import { useState, useEffect } from "react"; function Join() { //정규표현식 useState const [id, setId] = useState(''); //중복 id useState const [validId, setValidId] = useState(false); // ID의 정규식 표현:첫글자는 영문 대소문자이며, 나머지는 영문 대소문자, 숫자, 밑줄이 가능하고 //총 4~16글자이다. const ID_REG = /^[a-zA-Z][a-zA-Z0-9-_]{3,15}$/; // 정규표현식 일지하는지 검사 const setIdInfo = (e) => { let id = e.target.value.. 2022. 12. 14. [React] 같은 component의 list를 render할 때 todolist를 React로 다시 한 번 만들어 보면서 발생한 에러를 정리한다. list의 원소들을 화면에 뿌려주면서 타나난 Warning인데, Error : 같은 component의 list를 render할 때, key라는 prop을 넣어줘야 한다. 라는 뜻이다. react가 기본적으로 list에 있는 모든 item들을 인식하기 때문이다. {/* 에러가 발생한 코드 */} {todos.map((item) => {item})} {/* 변경한 코드 */} {todos.map((item, index) => {item})} 2022. 11. 28. [hooks] useState 1. useState 훅은 state와 setState를 배열형태로 반환해준다. setState를 사용해서 state를 변경할 때마다, 컴포넌트는 다시 렌더링이 된다. const [state, setState] = useState(초기값); 2. state를 변경할 때, 새로 변경된 state값이 이전 state값과 연관이 되어 있다면 setState의 인자로 새로운 state를 리턴하는 콜백함수를 넣어주는게 좋다. (콜백 함수란? () => {}) setState((prevState) => { return newState; }); 3. useState를 사용해서 어떤 무거운 일을 해야한다면 useState의 인자로 콜백함수를 넣어주면 맨 처음 렌더링할 때만 실행되게 할 수 있다. useState (().. 2022. 11. 17. 이전 1 다음
