2022.08.18 TIL

일하면서 배운것들

유저들은 주소창에 url 입력해서 들어가지 않고 링크타고 들어갑니다.
링크를 만들고 싶으면 react-router-dom에서 Link 컴포넌트 import 해오고
원하는 곳에서 쓰면 됩니다.

홈 상세페이지

git reset

git add .
git commit -m "cccc"
git log
git reset --hard a8a0d755e198e0a7fc771895226603832be3fe81
git checkout develop
git checkout -b hubdnckjw
git push origin hubdnckjw

axios를 통한 API 통신

경로 pages > business > form > join.tsx

import API from 'api/api'
import { VodaAPIResponseType } from 'model/common/api'
const getBusinessVaild = async () => {
   const apiData: VodaAPIResponseType = await API.business.join.checkCompanyNo(businessName, businessId)
   if(apiData.code === 200){
 		// 성공시
   }else{
 		// 실패시
   }
 }

경로 api > business > member > join.ts

import { AxiosRequestConfig } from 'axios'
import { axiosAPIHandler } from 'api/config'

export const join = {
  checkCompanyNo: async (name: string, businessNo: string) => {
    const config: AxiosRequestConfig = {
      url: `url`,
      method: 'GET',
      params: {
        name,
        business_num: businessNo,
      },
    }

    return await axiosAPIHandler(config)
  },
}

경로 api > business > api.ts

import { register } from './member/register'
import { join } from './member/join'

export const businessAPI = {
  register,
  join,
}

경로 api > api.ts

import axios from 'axios'
import { adminAPI as admin } from './admin/api'
import { businessAPI as business } from './business/api'
import { userAPI as user } from './user/api'

//axios.defaults.baseURL = BASE_URL

const API = {
  admin,
  business,
  user,
}

export default API

// 초기 에러 메세지 값
const initialInputData = {
  errorName: '',
  errorId: '',
};

  // 사업자번호 및 사업자명 정규식
  const checkValidation = (e: { target: { name: string; value: string } }) => {
    const { name, value } = e.target;
    switch (name) {
      case 'businessName':
        const Regex = /^[ㄱ-ㅎ|가-힣|a-z|A-Z|0-9|]+$/;
        if(value.length < 1){
          setErrors({
            ...errors,
            errorName : '사업자명을 입력해주세요.',
          });
        }else if(!Regex.test(value) && value.length > 1){
          setErrors({
            ...errors,
            errorName : '한글 및 영어, 숫자만 입력가능합니다.',
          });
        }else {
          setErrors({
            ...errors,
            errorName : '',
          });
        }
        return false;
      case 'businessNum':
        if(value.length < 10){
          setErrors({
            ...errors,
            errorId : '사업자 등록번호가 올바르지 않습니다.',
          });
        }else{
          setErrors({
            ...errors,
            errorId : '',
          });
        }
        return false;
      default:
          alert("입력 오류 메시지 정보가 없습니다.");
      }
  }

              <div className={commonCss.formInputItem}>
                <label htmlFor=''>
                  사업자명 <i>*</i>
                </label>
                <input
                  type='text'
                  placeholder='사업자명을 입력해주세요.'
                  maxLength={100}
                  name='businessName'
                  value={businessName}
                  onChange={handleChange}
                  onBlur={checkValidation}
                />
                {errors && (<span>{errors.errorName}</span>)}
              </div>