강의

멘토링

커뮤니티

Cộng đồng Hỏi & Đáp của Inflearn

Hình ảnh hồ sơ của skawkghkrk7742
skawkghkrk7742

câu hỏi đã được viết

[Renewal] Tạo NodeBird SNS bằng React

Triển khai Redux trong thực tế

리덕스 실제 구현하기 강의 질문

Đã giải quyết

Viết

·

351

0

안녕하세요 수강생입니다. 강의 내용중 질문이 있어 여쭤봅니다.

1.

이렇게 initailState를 넣고,

const initialState = {
    user: {
        isLoggedIn: false,
        user: null,
        signUpData: {},
        loginData: {},
    },
    post: {
        mainPosts: [],
    }
};

 

이렇게 case에 적으셨는데

        case 'LOG_IN':
            return {
                ...state,
                user: {
                    ...state.user,
                    isLoggedIn: true,
                    user: action.data
                },
            };

user:{

...state, <====이부분은 초기 state 전체로 이해하고있고,

user :{

...state.user, <=====이건 초기 state의 user:{ }정보

가 들어가는건데, 이미 다 들어간 상태에서 왜 또 isLoggedIn:true, user: action.data가 들어가는것인가요?

혹시 수정하는부분은 ...state.user로 일단 기존 state.user값을 넣어놓아야되고, 그밑에 변경할것들을 적어주면 알아서 중복되는것들을 변경해주는건가요??

 

저는 밑처럼 ..state.user, 를 빼는게 맞다고 생각하고 있었거든요.

                case 'LOG_IN':
            return {
                ...state,
                user: {
 
                    isLoggedIn: true,
                    user: action.data
                },
            };

 

 

  1. 아래 같은 에러가 나서 여쭤봅니다.

    store_configureStore__WEBPACK_IMPORTED_MODULE_4___default.a.withRedux is not a fu

    at Module../pages/_app.js

 

_app.js

import 'antd/dist/antd.css';
import { PropTypes } from 'prop-types';
import React from 'react';
import Head from 'next/head';
import wrapper from '../store/configureStore'

const PickMe = ({ Component }) => {
    return (
        <>
        <Head>
            <meta charSet="utf-8"/>
            <title>PICK-ME</title>
        </Head>
        <Component />
        </>
    )
};
 PickMe.propTypes = {
    Component: PropTypes.elementType.isRequired,
}


export default wrapper.withRedux(PickMe); 
reactnodejsexpressreduxNext.js

Câu trả lời 3

1

zerocho님의 프로필 이미지
zerocho
Người chia sẻ kiến thức

  1. ...state.user를 빼면 signUpData와 loginData가 사라집니다.

  2. configureStore.js 코드를 봐야 합니다.

0

kyj1님의 프로필 이미지
kyj1
Người đặt câu hỏi

아 그렇군요. 감사합니다. 문의가 많아보이는데 성실히 답변주셔서 감사하고 힘내십쇼!

0

kyj1님의 프로필 이미지
kyj1
Người đặt câu hỏi

configureStore.js


import {createWrapper} from 'next-redux-wrapper';
import {createStore} from 'redux';
import reducer from '../reducers'

const configureStore=()=>{
    const store=createStore(reducer);
    store.dispatch({
        type:'CHANGE_NICKNAME',
        data:'kim'
    })
    return store;
};

const wrapper = createWrapper(
    configureStore,
    {debug:process.env.NODE_ENV ==='development'}
    );

export default wrapper;

근데 실제화면에서는 createStore가 deprecated 되었다고 짝대기가 그어져있거든요. 근데 찾아보니 기능은 문제없다고해서 그냥 냅두고 하고있었습니다.

 

zerocho님의 프로필 이미지
zerocho
Người chia sẻ kiến thức

createStore 짝대기는 무시하셔도 됩니다. 이제는 redux-toolkit이 공식화되어서 redux 단독 사용을 비추천하는 것입니다.

웹팩 에러는 .next 폴더 지우고 기존 서버 다 끈 뒤 다시 빌드해보세요.

kyj1님의 프로필 이미지
kyj1
Người đặt câu hỏi

ㅡㅡ 일단 강의 그냥 진행하다가 미들웨어 적용하고있었고 껐다킨것도없는데, 그냥다시되네요..ㅡㅡ

const configureStore=()=>{
    const middlewares = [];
    const enhancer = process.NODE_ENV ==='production'
    ?compose(applyMiddleware(...middlewares))
    :composeWithDevTools(applyMiddleware(...middlewares))
    const store=createStore(reducer,enhancer);
    store.dispatch({
        type:'CHANGE_NICKNAME',
        data:'kim'
    })
    return store;
};

 

미들웨어랑 관련이 있을 수 있나요?ㅡㅡ

아니면 리덕스와 저와 합이 안맞는거같네요

zerocho님의 프로필 이미지
zerocho
Người chia sẻ kiến thức

아뇨 그냥 웹팩 빌드가 꼬인 겁니다. 리덕스랑 아무 관련 없는 에러입니다.

Hình ảnh hồ sơ của skawkghkrk7742
skawkghkrk7742

câu hỏi đã được viết

Đặt câu hỏi