时间戳

首页 > 解决方案 > 如何使用 rxjs 和 redux-observable 等待或监听 Url 的变化？

javascript - 如何使用 rxjs 和 redux-observable 等待或监听 Url 的变化？

问题描述

在收到响应数据并转到另一个页面后，我正在尝试显示模式弹出窗口。正确实施这一点很热吗？

使用React-observable和rxjs 。我确实使用对服务器的请求和更改 history.location 创建了一个史诗。它工作正常 

action$.pipe(
    ofType(myActionLading),
    mergeMap(action => of(convertDataToServer(action.payload))),
    mergeMap(data =>
      from(convertToDataAPI(data)).pipe(
        mergeMap(response => of(convertCustomerFromServer(response.
        mergeMap(() => {
         return of(
          actionGetDataInfoLoading({ id }),
          );
        }),
        tap(() => history.push('/newRoute')),
takeUntil(// I have to verify if I am already on my newRoute and then show the popUp),
        finalize(() => console.log('!!! FIN !!!') || 
          modals.getModalSuccess()),
   ),
    ),

我想在新路线上看到“成功”模式弹出窗口。所以我想听history.push，或者验证我是否在新路线上，然后才显示模态

标签： javascriptrxjsreactive-programming

解决方案

我不相信可以按照您解释的方式执行该逻辑（react-router至少）。

但是，如果/newRoute只能通过此操作成功到达，则可以在newRoute挂载对应的组件时打开模态框。

否则，提供查询参数以确定您是否要打开模式。

例如：

// someEpic.js
tap(() => history.push('/newRoute?showModal=true')

...

//newRoute.jsx (The component)
export class NewRoute extends React.Component {
   ...
   componentWillMount() {
       const showModal = this.props.... // logic to get query param of showModal.

       if (showModal) {
          modals.getModalSuccess();
       }
   }
}

推荐阅读