使用导航上的重新匹配存储库问题来响应本机旧版导航器

时间:2020-07-27 14:05:56

标签: react-native redux react-redux navigation redux-store

我想在React Native应用程序中使用2个不同的商店。 1是简单的redux存储,而rematch的1就像是包装上的包装。我正在尝试这样的事情,

store.js


import {
  applyMiddleware,
  createStore as _createStore
} from 'redux';
import reduxMiddleware from './Middleware/reduxMiddleware';
import { reducers } from "./reducers";

const store1 = _createStore(
  reducers,
  applyMiddleware(
    reduxMiddleware
  )
);

// Rematch
import { init } from '@rematch/core';
import * as models from './Models';

const store2 = init({
  models,
  redux: {},
  plugins: []
});

const persistor = getPersistor();

const finalStore = {
  persistor,
  store: {
    getState: () => ({
      ...store1.getState(),
      ...store2.getState(),
    }),
    dispatch: store1.dispatch,
    dispatchModel: store2.dispatch,
    subscribe: val => {
      store1.subscribe(val);
      store2.subscribe(val);
    }
  },
};

export default finalStore;

在组件中,我这样连接

import customConnect from '../../../Redux/customConnect';

const mstp = state => ({
    flag: state.someModel.flag
});

const mdtp = (any, dispatch) => ({
    setFlag: dispatch.someModel.setFlag
});

const SomeComponent = props => {
    console.log('PROPS:', props.flag);
    return (
       ...
       <Button onPress={() => setFlag('newValue')}> ... </Button>
       ...
    )
}

export default customConnect(mstp, mdtp)(SomeComponent);

customConnect.js

import { connect } from 'react-redux';
import configureStore from './store';

const { store } = configureStore;

const customConnect = (mstp, mdtp) => {
  finalMdtp = () => mdtp(store.dispatch, store.dispatchModel);

  return connect(mstp, finalMdtp);
};

export default customConnect;

基本上,当加载组件页面并单击按钮时,标志在存储中成功更改,组件重新呈现并显示新值。

但是,然后,当我导航(navigator.push)到其他页面->然后返回(navigator.pop)->单击按钮->商店中的值更新,因为我检查了模型的可容纳性- >,但该组件不会重新渲染

以某种方式可以正常工作,但是每当我导航时,如果所连接的商店值发生变化,那么它就不会更新组件的属性。

这仅发生在重新匹配模型中。

它使用传统的React本机Navigator组件进行导航。 这可能不是合并两个商店的最佳方法,但是请告诉我们是否有更好的方法,因为我们都需要。

谢谢。

1 个答案:

答案 0 :(得分:0)

当 Rematch 接受名为 redux 的配置属性时,您为什么要使用该变通方法来合并两个存储区,您可以在其中传递与 redux 相关的任何内容? (甚至是中间件,或减速器)

https://rematchjs.org/docs/api-reference/