1

我尝试通过调用 react-instantsearch 的findResultsStateAPI 来获取 resultsState，但无法与已经与 redux store 连接的组件集成。错误将如下所示。

不变违规：在组件的上下文或道具中找不到“存储”。要么将根组件包装在 a 中<Provider>，要么将“store”作为道具显式传递给组件

像这样调用api

findResultsState(
  component: Search, {
  searchState
});

我的组件看起来像这样。它由一些HOC组成，一些HOC会通过react-reduxconnect函数与redux store连接。

Search = compose(
  intlWrapper,
  withModal,
  withGlobalAlert,
  withMainLayout,
  injectIntl,
)(Search);

服务器端 Provider 会这样渲染

const appString = renderToString(
  <Provider store={store}>
    <StaticRouter location={req.url} context={ context }>
      <Main />
    </StaticRouter>
  </Provider>
);

客户端：

const store = configureStore(history, 
window.__APP_INITIAL_REDUX_STATE__);

// Render component
hydrate(
  <Provider store={store}>
    <ConnectedRouter history={history}>
      <Main />
    </ConnectedRouter>
  </Provider>,
  document.getElementById('root'),
);

主要的

<Switch>
  { routes.map( route => <Route key={ route.path } { ...route } />)}
</Switch>

路线

export default [
  {
    path: '/search',
    component: Search,
  },{
   ...
  }
  ...
];
4

0 回答 0