잘잘이들

• 토큰에서 ""빼줘야 한다

• 3000포트가 아니면 cros오류가 발생한다

• 이벤트핸들러함수를 props으로 받는 것은 자식에게 이벤트가 일어났을 때 부모가 대응하기 위함 실행 시 인자(부모가 사용해야하는 값)를 넣어주면 부모 컴포넌트에서 자식의 값을 이용할 수 있음

• children을 jsx를 반환하는 함수로 받으면 해당 컴포넌트의 상태을 사용한 children을 만들 수 있다

return (
    <div onClick={handleChooseFile} {...props}>
      <Input
        type="file"
        ref={inputRef}
        name={name}
        accept={accept}
        onChange={handleFileChange}
        disabled={disabled && disabled}
      />
      {typeof children === 'function' ? children(file) : children}
    </div>
  );

• 라우터 관련 함수를 props으로 받아서 쓰려면
1. BrowserRouter컴포넌트로 App컴포넌트를 감싼다

ReactDOM.render(
  <React.StrictMode>
    <BrowserRouter>
      <App />
    </BrowserRouter>
  </React.StrictMode>,
  document.getElementById('root'),
);

 
1. router컴포넌트의 component 속성에 props으로 연결할 컴포넌트를 할당함

<Route exact path="/series/:id" component={SeriesDetailPage} />

 
 

• 이미 함수안에 await이 있다면 한 번 더 안써줘도 된다

export const getSeriesDetail = async ({ params }) => {
  const response = await GET({
    url: `/series/${params}`,
    isAuth: false,
  });
  return response;
};

• 토큰에서 ""빼줘야 한다

return (
    <div onClick={handleChooseFile} {...props}>
      <Input
        type="file"
        ref={inputRef}
        name={name}
        accept={accept}
        onChange={handleFileChange}
        disabled={disabled && disabled}
      />
      {typeof children === 'function' ? children(file) : children}
    </div>
  );

1. BrowserRouter컴포넌트로 App컴포넌트를 감싼다

ReactDOM.render(
  <React.StrictMode>
    <BrowserRouter>
      <App />
    </BrowserRouter>
  </React.StrictMode>,
  document.getElementById('root'),
);

1. router컴포넌트의 component 속성에 props으로 연결할 컴포넌트를 할당함

<Route exact path="/series/:id" component={SeriesDetailPage} />

export const getSeriesDetail = async ({ params }) => {
  const response = await GET({
    url: `/series/${params}`,
    isAuth: false,
  });
  return response;
};