회원가입 서비스 트러블 슈팅

박재훈·2023년 2월 26일
0

React

목록 보기
6/6
  1. 회원가입 로그인 제대로 동작안함
  1. objects are not valid as a react child (found: [object response]). if you meant to render a collection of children, use an array instead.
    해결방법 : 객체를 그대로 콘솔찍으려고 했기때문. 출처 (https://itprogramming119.tistory.com/entry/React-Objects-are-not-valid-as-a-React-child-%ED%95%B4%EA%B2%B0-%EB%B0%A9%EB%B2%95)

  2. privateRouting 코드작성중
    A is only ever to be used as the child of element, never rendered directly. Please wrap your in a .

-> 원래 코드는 아래처럼 Route 컴포넌트를 계속 렌더하려는것 자체가 문제였다. 스택오버플로우에 나온 해결책대로 하니 정상작동했다.

import React from "react";
import { Route, Redirect, useLocation } from "react-router-dom";

function PrivateRoute({ children: Component, ...props }) {
 const location = useLocation();
 return (
   <Route
     {...props}
     render={(componentProps) => {
       // location.state가 없으면, /login 페이지로 이동합니다.
       const isLoggedIn = !!location.state.user;

       if (!isLoggedIn) {
         return <Redirect to="/login" />;
       }

       return Component;
     }}
   />
 );
}

export default PrivateRoute;

     
     
//리팩토링후
import { redirect, useLocation } from "react-router-dom";

export default function PrivateRoute({ children }) {
 const location = useLocation();

 return !!location.state.user ? children : redirect("/login");
}

     

https://stackoverflow.com/questions/69864165/error-privateroute-is-not-a-route-component-all-component-children-of-rou

  1. formData 넘길때, 중괄호있어서 제대로 전달이 안됐음.
export default function RegisterForm({ onSubmit }) {
  const emailRef = useRef();
  const passwordRef = useRef();

  const submitForm = (e) => {
    e.preventDefault();

    const email = emailRef.current.value;
    const password = passwordRef.current.value;

    const formData = {
      email,
      password,
    };

    onSubmit(formData); //onSubmit({formData}) 원래 이렇게 썼음.
  };
      ```
profile
신입 개발자

0개의 댓글