-
질문 & 답변
카테고리
-
세부 분야
풀스택
-
해결 여부
해결됨
리덕스 실제 구현하기 강의 질문
22.10.19 10:31 작성 조회수 187
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
},
};
아래 같은 에러가 나서 여쭤봅니다.
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); 
답변을 작성해보세요.
1
0
0
kyj1
질문자2022.10.19
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 되었다고 짝대기가 그어져있거든요. 근데 찾아보니 기능은 문제없다고해서 그냥 냅두고 하고있었습니다.
조현영
지식공유자2022.10.19
createStore 짝대기는 무시하셔도 됩니다. 이제는 redux-toolkit이 공식화되어서 redux 단독 사용을 비추천하는 것입니다.
웹팩 에러는 .next 폴더 지우고 기존 서버 다 끈 뒤 다시 빌드해보세요.
kyj1
질문자2022.10.19
ㅡㅡ 일단 강의 그냥 진행하다가 미들웨어 적용하고있었고 껐다킨것도없는데, 그냥다시되네요..ㅡㅡ
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;
};
미들웨어랑 관련이 있을 수 있나요?ㅡㅡ
아니면 리덕스와 저와 합이 안맞는거같네요
답변 3