передать данные в themeProvider - PullRequest
Новая
       23

передать данные в themeProvider

0 голосов
/ 03 апреля 2020

У меня проблема с ThemeProvider в моем следующем js проекте. Я думаю, что это лучший способ передать данные в тему. В моем getInitialProps внутри /pages/index я получаю данные настроек, а тег ThemeProvider находится в /pages/_app.js обертке <Component /> .. как я могу передать данные из индекса в _app? Есть идеи? Спасибо !!

вот мой код:

/ pages / _app. js

import App from "next/app";
import React from "react";
import Head from "next/head";

/* Styles */
import { ThemeProvider } from "styled-components";
import theme from "../styles/theme/primary";

class MyApp extends App {
  render() {
    const { Component, pageProps } = this.props;
    return (
      <>
        <ThemeProvider theme={theme}>  // Here ThemeProvider whit theme
          <Header />
          <Container>
            <Component {...pageProps} />
          </Container>
          <Footer />
        </ThemeProvider>
      </>
    );
  }
}

export default MyApp;

страниц / индекс. js

import React, { useState, useEffect } from "react";

/* Others */
import { getData } from "../helper/api";

const Index = props => {
  const res = props.data;

  return (
    <>
      <Home data={res} />
    </>
  );
};

Index.getInitialProps = async ({ res }) => {
  try {
    let req = await getData(); // Here I get the settings. 
    return { data: req };
  } catch (e) {
    console.log(`Error: ${e}`);
    return { data: null};
  }
};

export default Index;
...