Redux ajax monitored throttle only asks for some conditions

In my application, reactjs reduxI use abbreviated observable epicsmiddleware for ajax requests to cancel some requests.

const epicRequest = $actions => {
  return $actions
         .ofType(MY_ACTION_TYPE)
         .debounceTime(500)
         .switchMap( action =>{
            // Doing Ajax
          })
} 

My problem is that I call this action, when I press several buttons, I have two types of buttons that can trigger the same action, in this case, if the call from the first action and the second action is another button, I do not want to refuse, I want to cancel only if the action occurs from a single button.

+4
source share
2 answers

, .

, .

onclick = () => {
  // assume arg name is 'from'
  this.props.yourAction('a') // can be 'a'/'b' ...
}

, .

const yourAction = (from) => {
  return { type: MY_ACTION_TYPE, from }
}

case MY_ACTION_TYPE:
  return {...state, from:action.from}

, , .debounceTime(600) .debounce(), , , Observable.timer(). , debounce.

let from = null
const epicRequest = $actions => {
    return $actions
        .ofType(MY_ACTION_TYPE)
        //.debounceTime(500)
        .debounce((action) => {
            // check button type is not yet set or not previous type
            const  timer = !from || (from !== action.from)  ? Observable.timer(0) : Observable.timer(600)
            // update button type
            from =  (from !== action.from) ? action.from : from
            // return Observable.timer()
            return timer
        })
        .switchMap( action =>{
            // Do your Ajax
        })
}
+3

, , , , , , debouncing. :

I , . , . , , groupBy , .

const epicRequest = action$ =>
  action$
    .ofType(MY_ACTION_TYPE)
    .groupBy(action => action.somethingUnique)
    .mergeMap(action$ =>
      action$
        .debounceTime(500)
        .switchMap(action => {
          // Doing Ajax
        })
    );

, , , somethingUnique.

groupBy

: groupBy never complete() Observable, , , . , , . , groupBy , , , , - , , , , Observable, . - , . . : http://reactivex.io/rxjs/class/es6/Observable.js~Observable.html#instance-method-groupBy    durationSelector: function(grouped: GroupedObservable<K, R>): Observable<any>

1 debounced,

, . , - , .

, debouncing, , MY_ACTION_TYPE_DEBOUNCED, debouncing MY_ACTION_TYPE

const myActionTypeDebouncedEpic = action$ =>
  action$
    .ofType(MY_ACTION_TYPE_DEBOUNCED)
    .debounceTime(500)
    .map(action => ({
      ...action,
      type: MY_ACTION_TYPE
    }));

const myActionTypeEpic = action$ =>
  action$
    .ofType(MY_ACTION_TYPE)
    .switchMap(action => {
      // Doing Ajax
    });
0

Source: https://habr.com/ru/post/1693176/


All Articles