javascript - WithStore：无法读取未定义的属性“状态”（纯反应轮播）

Question

我使用pure-react-carousel库并尝试通过onClick按钮的方法导航到特定幻灯片。

请解释我如何使用setStoreState，因为我试图自己做（如文档中所写）并且我使用它的整个页面都是不可见的。我尝试使用this.props.carouselStore.setStoreState({ currentSlide: 2 }).

当我添加导出 withStore 时，我的页面变得不可见。我得到以下错误。

Error is Uncaught TypeError: Cannot read property 'state' of undefined
my export
    export default WithStore(MyComponent, state => ({
        currentSlide: state.currentSlide,
      }));

Answer 1

我实际上是 Pure React Carousel 的作者。

WithStore()只有当它是一个孩子时才有效<CarouselProvider />

WithStore 访问 React 的上下文 API。CarouselProvider 创建上下文。当你创建上下文时，React 只会将上下文传递给创建上下文的组件的子组件。

因此，在这个伪代码示例中使用 WithStore 会给您带来错误。

<YourComponentThatUsesTheWithStoreHOC />
<CarouselProvider>
  // all your buttons, slides, dots, etc...
</CarouselProvider>

这也会给你带来错误。

<CarouselProvider>
  // all your buttons, slides, dots, etc...
</CarouselProvider>
<YourComponentThatUsesTheWithStoreHOC />

这个伪代码示例将起作用

<CarouselProvider>
  // all your buttons, slides, dots, etc...
  <YourComponentThatUsesTheWithStoreHOC />
</CarouselProvider>

Answer 2

括号是不必要的。尝试这个：

export default WithStore(MyComponent, state => {
    currentSlide: state.currentSlide,
  });