inflearn logo
강의

강의
N
챌린지

챌린지
멘토링

멘토링
N
클립

클립
로드맵

로드맵
지식공유

Kim_Jaeho님의 게시글

Kim_Jaeho Kim_Jaeho

@roki037184

수강평 작성수
-
평균평점
-

게시글 2

질문&답변

profile 페이지 (로그인 했을때 vs 로그인 안했을 때)

AppLayout 코드입니다. import React , { useState } from ' react '; import PropTypes from ' prop-types '; import Link from ' next/link ' import Image from ' next/image '; import { Menu , Input , Dropdown } from ' antd '; import { TwitterOutlined } from ' @ant-design/icons '; import { useSelector , useDispatch } from " react-redux " import { logoutAction } from ' ../reducers/user '; const { Search } = Input const dropDownMenu = ( dispatch ) => { return ( Menu > Menu.Item key = " 0 " > Link href = ' /profile ' > a > Profile a > Link > Menu.Item > Menu.Item key = " 1 " > a target = " _blank " rel = " noopener noreferrer " href = " https://www.aliyun.com " > 2nd menu item a > Menu.Item > Menu.Divider /> Menu.Item key = " 3 " > a href = " / " onClick ={( e ) => { e . preventDefault () ; dispatch ( logoutAction ) }} > LOG OUT a > Menu.Item > Menu > ) ;} const AppLayout = ({ children }) => { const isLoggedin = useSelector ( ( state ) => state . user . isLoggedin ) ; const dispatch = useDispatch () ; return ( Menu mode = " horizontal " > Menu.Item > Link href = ' / ' > a style ={{ fontSize : " 2vw " }} > TwitterOutlined style ={{ fontSize : ' 21px ' , width : ' 40px ' , paddingLeft : ' 10px ' }} /> a > Link > Menu.Item > Menu.Item style ={{ marginLeft : " 20vw " }} > Search placeholder = " input search text " allowClear style ={{ width : " 25vw " , verticalAlign : " middle " }} /> Menu.Item > { isLoggedin ? Menu.Item style ={{ marginLeft : " 20vw " }} > div style ={{ height : " 46px " }} > Dropdown overlay ={ dropDownMenu ( dispatch ) } > a className = " ant-dropdown-link " onClick ={ e => e . preventDefault () } > Image src = " /img/groot2.jpg " alt = " profileImg " width = " 44 " height = " 44 " /> a > Dropdown > div > Menu.Item > : Menu.Item > Link href = ' /signIn ' > a style ={{ fontSize : " 2vw " }} > Sign In a > Link > Menu.Item > Menu.Item > Link href = ' /signUp ' > a style ={{ fontSize : " 2vw " , border : " solid 0.5px " , borderRadius : ' 5px ' , padding : " 5px " }} > Sign Up a > Link > Menu.Item > } Menu > { children } ) ; }; AppLayout . propTypes = { children : PropTypes . node . isRequired , }; export default AppLayout ;

좋아요수
0
댓글수
2
조회수
300

질문&답변

profile 페이지 (로그인 했을때 vs 로그인 안했을 때)

profile.js 코드입니다. import React , { useEffect } from ' react '; import Head from ' next/head '; import { useSelector } from ' react-redux '; import AppLayout from ' ../components/appLayout '; import ProfileEditForm from ' ../components/ProfileEditForm '; import FollowList from ' ../components/FollowList '; const Profile = () => { console . log ( " profile 페이지 들어갑니다잉 " ) ; let isLoggedin = useSelector ( ( state ) => state . user . isLoggedin ) ; let followerList ; let followingList if ( isLoggedin ) { followerList = useSelector ( ( state ) => state . user . user . Followers ) ; followingList = useSelector ( ( state ) => state . user . user . Followings ) ; } console . log ( ` 로그인했나? ${ isLoggedin } , 팔로워리스트 ${ followerList } , 팔로잉리스트 ${ followingList }` ) ; return ( Head > title > 프로필 | NodeBird title > Head > AppLayout > { isLoggedin ? ProfileEditForm /> FollowList header = " Follower List " data ={ followerList } /> FollowList header = " Following List " data ={ followingList } /> : div > pls login div > } AppLayout > ) ; }; export default Profile ;

좋아요수
0
댓글수
2
조회수
300