как получить и получить данные в nextjs, используя withRedux (pageName) - PullRequest
Новая
       67

как получить и получить данные в nextjs, используя withRedux (pageName)

0 голосов
/ 23 октября 2019

Я новичок в nextjs и ssr.

Я хочу получить данные из getInitialProps с отправкой своего действия и получить эти данные в качестве реквизитов на странице индекса. Но реквизиты индекса равны нулю, и я хочу получитьСостояния и реквизиты с помощью mapstatetoprops тоже. Как я могу сделать оба? и еще одна проблема заключается в том, что thunk в applymiddleware является ошибкой !!

! [screenshot nextjs code] [1]

Я работаю с json-сервером. Я настраиваю файл хранилища, как пример nexjs вhttps://github.com/zeit/next.js/blob/canary/examples/with-redux/store.js

У меня есть actiona и редукторы в отдельном каталоге и я импортировал их в файл для хранения.

store.js 

import { createStore, applyMiddleware } from 'redux'
import thunk from "redux-thunk";
import { composeWithDevTools } from 'redux-devtools-extension'
import reducers from '../client/redux/reducers'
const initialState = {};


export const initializeStore = (preloadedState = initialState) => {
    return createStore(
        reducers,
        preloadedState,
        composeWithDevTools(applyMiddleware(thunk))
    )
}

комбайны редукторов: 

 import {combineReducers} from "redux";
    import authReducer from './authReducer';
    import postReducer from "./postReducer";
    import userReducer from "./userReducer";
    import {reducer as fromReduce} from "redux-form";

    const rootReducer = combineReducers({
        auth: authReducer,
        posts: postReducer,
        form: fromReduce,
        user:userReducer
    });
    export default rootReducer;

и это мое действие: 

   export const fetchPosts=() => async dispatch => {
        const response=await api.get('/posts');
        dispatch({type:FETCH_POSTS,payload: response.data});
    }

index.js 

 import React from "react";
    import {withRedux} from '../lib/redux'
    import {connect} from 'react-redux';
    import Header from "../components/header";
    import {fetchPosts} from "../redux/actions/postAction";

    import PostList from '../components/postList'

    const Index = (props) => {
        console.log(props)

        return (
            <React.Fragment>
                <Header/>
                <PostList posts={props.posts}/>
            </React.Fragment>

        );
    };
    Index.getInitialProps = async ({reduxStore}) => {
        const {dispatch} = reduxStore;
        await dispatch(fetchPosts());
        return {}
    }


    export default withRedux(Index);

console.log (props) return 

 url:
   { query: [Getter],
     pathname: [Getter],
     asPath: [Getter],
     back: [Function: back],
     push: [Function: push],
     pushTo: [Function: pushTo],
     replace: [Function: replace],
     replaceTo: [Function: replaceTo] } }

что не так смне? почему сообщения не отображаются в консоли?

...