Не удается прочитать свойство 'getState' с неопределенной ошибкой

Question

• Я пытаюсь добавить реактивный липкий заголовок к моему степперу.

• но проблема в том, что если я добавлю в свой App.js его не рендеринг.

• поэтому я начал отлаживать код App.js.
• если я даю консоль внутри моего метода рендеринга App.js, то он не отображает console.log ("App ---->");
• прямо сейчас я получаю Не могу прочитать свойство 'getState' с неопределенной ошибкой
• подскажите, как это исправить.
• так что в будущем я сам исправлю.
• предоставив мой фрагмент кода и песочницу ниже

https://codesandbox.io/s/6zv5n0ro9z

App.js

import React from "react";
import { StickyContainer, Sticky } from "react-sticky";
// ...

class App extends React.Component {
  render() {
    console.log("App---->");
    return (
      <StickyContainer>
        {/* Other elements can be in between `StickyContainer` and `Sticky`,
        but certain styles can break the positioning logic used. */}
        <Sticky>
          {({
            style,

            // the following are also available but unused in this example
            isSticky,
            wasSticky,
            distanceFromTop,
            distanceFromBottom,
            calculatedHeight
          }) => <header style={style}>{/* ... */}</header>}
        </Sticky>
        {/* ... */}
      </StickyContainer>
    );
  }
}

index.js

import React from "react";
//import ReactDOM from "react-dom";
import Demo from "./demo";
import App from "./components/App";
import { render } from "react-dom";
import { logger } from "redux-logger";
import { Provider } from "react-redux";

import { createStore, applyMiddleware } from "redux";
//import reducer from "./reducers";
import thunk from "redux-thunk";

//const store = createStore(reducer, applyMiddleware(thunk, logger));

//ReactDOM.render(<Demo />, document.querySelector("#root"));

render(
  //     <Provider store={store}>
  <Provider>
    <App />
  </Provider>,
  document.getElementById("root")
);

Answer 1

Вам нужно либо передать store в Provider, как предлагает Марк, либо, если вы упростили свой пример до такой степени, что он вам не нужен, то полностью удалите элемент Provider, чтобы вы просто рендерили App элемент. Текущая трассировка стека показывает, что ошибка в Provider.

Вам также необходимо добавить:

export default App;

в конец App.js.

Answer 2

Если вы собираетесь визуализировать React-Redux <Provider>, вы должны создать хранилище Redux и передать его как реквизит с именем store. Я вижу, у вас есть эти строки - вы должны раскомментировать их.