Redux Saga-将结果返回给被调用方函数,而不是分派新操作

时间:2018-07-13 09:59:14

标签: reactjs redux yield redux-saga

我将我的react项目移至redux和redux-saga。最初,我调用异步方法来获取大数据集,然后将其设置为本地状态,如下所示:

// Component.jsx
componentDidMount() {
   const dataPromise = this.getTableData()
   const data = await dataPromise
   this.setState({ data })
}

getTableData = async() => {
   const response = await APIUtils.getTableData()
   let data = null
   if (response && response.code === "200") {
      data = response.data
   }
   return data
}

现在有了redux,我正在像这样更改它

// Component.jsx
componentDidMount() {
  const data = this.props.getTableData() // how to get data here?
  this.setState({ data })
}

// ActionCreator.js
function getTableData() {
   return {
     type: "GET_TABLE_DATA"
   }
}

// saga.js
function *getTableData() {
   try {
        const response = yield call(APIUtils.getTableData)
        ...
        // here I want to send this response.data to my comp without calling store action as the dataset is large and it is read-only.

    } catch (err) {
        yield put(showError(false))
    }
}

export default function* root() {
  yield all([
    takeLatest("GET_TABLE_DATA", getTableData)
  ])
}

我是redux-saga的新手,有人告诉我什么是最好的方法。

1 个答案:

答案 0 :(得分:1)

您需要调度将更新您商店的操作。然后,将组件连接到商店并从商店获取数据。