在Redux-saga中，如何在一個傳奇故事中調用傳奇？

在我的React應用程序中，有一個Saga調用後端API來檢索某些圖表數據。請閱讀源代碼在Redux-saga中，如何在一個傳奇故事中調用傳奇？

function fetchData() { 
    return fetch(`${config.base}dashboard_charts.json`) 
    .then((response) => { 

     if (response.status === 200) { 
      return response.json(); 
     } else if (response.status === 403) { 
      return 'logon'; 
     } 
    }); 
} 

function * getData (action) { 
    try { 
     const charts = yield call(fetchData); 

     if (charts === 'logon') { 
      yield logon(); 
     } else { 
      yield put({ type: UPDATE_DASHBOARD_CHART, charts }); 
     } 
    } catch (error) { 
     yield put({ type: UPDATE_DASHBOARD_CHART, charts: [] }); 
    } 
} 

function * logon (action) { 
    yield auth(); 
} 

export default function * portfolio() { 
    yield [ 
     takeEvery(FETCH_DASHBOARD_CHART, getData) 
    ]; 
};

有反對的功能fetchData HTTP響應狀態的檢查，如果狀態爲200，然後直接返回響應。但是，如果服務器端返回403，這意味着客戶端需要進行身份驗證，因此該程序將轉到auth（）並執行登錄。

但是，http響應狀態代碼檢查在某種程度上是適用於所有API調用的通用功能。所以我不想在每個傳奇中重複這種代碼。爲此，我寫了一個服務「ResponseHandler所」進行分組響應代碼檢查裏面是這樣的：

export default function responseHandler (resp) { 
    if (resp.status === 401 || resp.status === 403) { 
     yield auth(); 
    } else if (resp.status === 200) { 

    } else { 
     console.log('error handling'); 
    } 
};

它會叫的fetchData

return fetch(`${config.base}dashboard_charts.json`) 
    .then((response) => { 
     responseHandler(response); 
    });

內，但這種方法是從來沒有工作。 'yield auth（）'在responseHandler中無效。

任何人都可以建議如何更好地設計這種情況下的代碼？

來源

2017-04-17 jm li

也許它是有道理的組織邏輯幾個？

首先，可以修改讀取封裝器，以便在不符合成功結果形成預期的響應代碼的HTTP源的情況下，執行到捕獲部分的轉換。它將允許以純承諾的形式保存fetchData函數，而無需輸入生成器邏輯。

其次，auth和logon函數的本質並不是特別清楚。如果通過這種行爲的結果生成登錄表單，然後通過適當的重新排序操作來實現。如果需要轉換到其他頁面，請使用react-redux-router。

function fetchData() { 
     return fetch(`${config.base}dashboard_charts.json`).then(response => (
      (response.status === 200) ? response.json() : Promise.reject('logon') 
     )); 
    } 

function* getData (action) { 
    try { 
     const charts = yield call(fetchData); 
     yield put({ type: UPDATE_DASHBOARD_CHART, charts }); 
    } catch (error) { 
     yield put({ type: UPDATE_DASHBOARD_CHART, charts: [] }); 
     if(error.message === 'logon') { 
      yield put({ type: PERMORM_AUTORIZE }); 
     } 
    } 
} 

export default function * portfolio() { 
    yield [ takeEvery(FETCH_DASHBOARD_CHART, getData) ]; 
};

，是你的邏輯比較複雜，僅僅使用fork從redux-saga。它允許執行更復雜的任務。

來源

2017-04-17 11:30:55

在Redux-saga中，如何在一個傳奇故事中調用傳奇？

回答

相關問題