Добавить данные в находящуюся на рассмотрении полезную нагрузку

Question

Я использую axios, redux и промежуточное программное обеспечение redux-promise.

У меня есть следующие действия создателя:

return { 
     type: 'FETCH_USERS', 
     payload: axios.get('http://localhost:8080/users', 
      { 
       params: { 
        page 
       } 
      } 
     ) 
    } 

В моем редукторе для действия FETCH_USERS_PENDING, я хотел бы сохранить требуемый URL в моем государстве. Как я могу это сделать?

Answer 1

Просто передайте URL в действии, а также:

return { 
    type: 'FETCH_USERS', 
    url: 'http://localhost:8080/users', 
    payload: axios.get('http://localhost:8080/users', { 
    params: { 
     page 
    } 
    } 
} 

и доступ к нему в редукторе с action.url. Или вы можете оставить действие, как она есть, и доступ к нему в резолюции обещание:

action.payload.then(function(response) { 
    var url = response.config.url; 
}); 

Answer 2

Вы хотите использовать Redux-обещание-Middleware пакет «мета» переменной. Нравится так:

return { 
    type: 'FETCH_USERS', 
    meta: { url: 'http://localhost:8080/users' }, 
    payload: axios.get('http://localhost:8080/users', config) 
} 

Вы можете передать его в своих параметрах, но это не будет возвращено до тех пор, пока страница не будет извлечена. Это означает, что он не будет возвращен во время FETCH_USERS_PENDING.

И я уверен, что если вы включите прямо в объект возврата (например, как предложил Лукас), он будет удален из этапа FETCH_USERS_PENDING.

Вот этап FETCH_USERS_PENDING от Redux-обещание-промежуточного слоя:

/** 
    * First, dispatch the pending action. This flux standard action object 
    * describes the pending state of a promise and will include any data 
    * (for optimistic updates) and/or meta from the original action. 
    */ 
    next({ 
    type: `${type}_${PENDING}`, 
    ...(data !== undefined ? { payload: data } : {}), 
    ...(meta !== undefined ? { meta } : {}) 
    }); 

Как вы можете видеть на этой стадии, промежуточное программное обеспечение возвращает прилагаемую атрибут «тип» и он проверяет «данных» & «мета» атрибутов. Если они присутствуют, они передаются в рамках действия.

Вот redux-promise-middleware source code, если вы хотите изучить его дальше.