소개
게시글
질문&답변
Unhandled Runtime Error
아 죄송합니다 제가 뭘 빼먹었었네요 잘 동작됩니다 ㅜㅜ
- 0
- 5
- 466
질문&답변
Unhandled Runtime Error
아 오타가 있었네요 LggedIn 근데 그거 오타 수정해도 똑같은 에러가 나네요 ㅜㅜ
- 0
- 5
- 466
질문&답변
Unhandled Runtime Error
아 네 알겠습니다. AppLayout 코드 입니다. import { useState } from 'react'; import PropTypes from 'prop-types'; import Link from 'next/link'; import { Input, Menu, Row, Col } from 'antd'; import UserProfile from '../components/UserProfile'; import LoginForm from '../components/LoginForm'; import styled from 'styled-components'; const SearchInput = styled(Input.Search)` vertical-align: middle `; const AppLayout = ({ children }) => { // ToDo const [isLoggedIn, setIsLoggedIn] = useState(false); return ( div> Menu mode="horizontal"> Menu.Item key="home"> Link href="/">a>홈a>Link> Menu.Item> Menu.Item key="profile"> Link href="/profile">a>프로필a>Link> Menu.Item> Menu.Item key="search"> SearchInput enterButton /> Menu.Item> Menu.Item key="signup"> Link href="/signup">a>회원가입a>Link> Menu.Item> Menu> {/* column 사이 간격: gutter */} Row gutter={8}> Col xs={24} md={6}> {isLoggedIn ? UserProfile setIsLoggedIn={setIsLoggedIn} /> : LoginForm setIsLoggedIn={setIsLoggedIn} /> } Col> Col xs={24} md={12}> 가운데 메뉴 Col> Col xs={24} md={6}> 오른쪽 메뉴 Col> Row> {children} div> ) } // children 값이 있는지 체크하기 위한 용도 AppLayout.propTypes = { children: PropTypes.node.isRequired, }; export default AppLayout;
- 0
- 5
- 466
질문&답변
Unhandled Runtime Error
오타는 아닌 것 같습니다. 대소문자까지 같이 해서 확인해 봤어요.로그인 폼 코드 붙여넣기 해서 드립니다. import { useState, useCallback, useMemo } from 'react'; import PropTypes from 'prop-types'; import { Form, Input, Button } from 'antd'; import Link from 'next/link'; import styled from 'styled-components'; const ButtonWrapper = styled.div` margin-top: 10px; `; const FormWrapper = styled(Form)` padding: 10px; `; const LoginForm = ({ setIsLoggedIn }) => { const [id, setId] = useState(''); const [password, setPassword] = useState(''); const onChangeId = useCallback((e) => { setId(e.target.value); }, []); const onChangePassword = useCallback((e) => { setPassword(e.target.value); }, []); const style = useMemo(() => ({ marginTop: 10}), []) const onSubmitForm = useCallback(() => { console.log(id, password); setIsLoggedIn(true); }, [id, password]); return ( FormWrapper onFinish={onSubmitForm}> div> label htmlFor="user-id">아이디label> br /> Input name="user-id" value={id} onChange={onChangeId} required /> div> div> label htmlFor="user-password">비밀번호label> br /> Input name="user-password" value={password} onChange={onChangePassword} required /> div> ButtonWrapper style={style}> Button type="primary" htmlType="submit" loading={false}>로그인Button> Link href="/signup">a>Button>회원가입Button>a>Link> ButtonWrapper> FormWrapper> ); } LoginForm.propTypes = { setIsLoggedIn: PropTypes.node.isRequired, }; export default LoginForm;
- 0
- 5
- 466
질문&답변
제가 latest next js 버전 11에서 하고 있는데 PropTypes를 찾지 못한다고 나와요
아 제가 이 부분을 놓쳤네요 감사합니다~!
- 0
- 2
- 235