Получение данных в других компонентах с помощью реагирующего крючка - PullRequest
0 голосов
/ 06 июля 2019

Я новичок в реагировании на крючки и немного экспериментирую.Я могу отобразить свои значения, которые генерируются в Provider.js в App.js через Comptest.js.Моя проблема в том, что структура моего проекта с css и т. Д. Делает неудобным иметь такую ​​структуру в App.js, как это:

<Provider>
    <Comptest />
</Provider>

можно ли получать данные без отображения компонентов таким образомв приложении?просто передавая его между компонентами.

Вот компактная версия моего приложения:

App.js

import React, { useContext } from "react";
import Provider from "./Provider";
import Comptest from "./Comptest";
import DataContext from "./Context";

function App() {

  return (
    <div className="App">
      <h2>My array!</h2>
      <Provider>
        <Comptest />
      </Provider>
    </div>
  );
}

export default App;

Provider.js

import React, { useState } from "react";
import DataContext from "./Context";

const Provider = props => {
  const data = ["item1", "item2"];

  return (
    <DataContext.Provider value={data}>{props.children}</DataContext.Provider>
  );
};

export default Provider;

Comptest.js

import React from "react";
import DataContext from "./Context";

const Comptest = () => {
  const content = React.useContext(DataContext);

  console.log(content);

  return <div>{(content)}</div>;
};

export default Comptest;

Context.js

import React from "react";

const DataContext = React.createContext([]);

export default DataContext;
...