Question

我希望能够在具有不同状态树的生产React / Redux应用程序中加载新捆绑包并容纳已登录的用户。我希望通过提示这些用户来执行此操作注销，以便我可以重置状态树。

我的方法

通过从Node传递一个版本，我可以将存储配置为使用（或不使用）版本密钥将version: {latest: VERSION, current: null}密钥插入状态树。我可以＆＃34;劫持＆＃34;当我从本地存储加载用户现有状态时，这将进入状态树（仅当用户重新连接到节点服务器时才会发生）。

const {VERSION} = process.env;

const preloadedState = loadStateFromLocalStorage();

const browserVersion = (preloadedState.version && preloadedState.version.current) || null;

const store = createStore(
    rootReducer,
    Object.assign({}, preloadedState, {version: {latest: VERSION, current: browserVersion}}),
    middleware
);

然后，我可以检查我的AppContainer组件（因为它是认证后第一个要安装的组件）latest版本与current版本。

class AppContainer extends React.Component {
    componentDidMount() {
        this.props.dispatch(checkForUpdates());
    }
    componentDidUpdate() {
        this.props.dispatch(checkForUpdates());
    }
    render() {
        return <App {...this.props} />
    }
}

checkForUpdates()会提示一个模式，指示用户必须注销才能继续。注销会将整个州设置为{version: {latest: VERSION, current: VERSION}}。

这种方法在完成我试图完成的任务时似乎过于复杂，这基本上是为了（a）通知用户升级（b）日志用户输出/清除状态（c）从更新中加载新的初始状态JS捆绑。

这可以解决边缘情况吗？这是完成将版本号保存到状态树的合理方法吗？

Answer 1

你有什么理由在Redux中做到这一点吗？ [在评论中回答]

在执行ReactDOM.render之前，您可以使用vanilla JS比较版本来避免整个reducer和dispatch。

<强>更新：

查看redux-persist和redux-persist-migrate。我没有使用它们，但它是对redux状态持久性和迁移的抽象。

在生产中保留现有Redux商店的版本号

1 个答案: