A 'yield' expression is only allowed in a generator body

Question

I'm using redux-saga to fetch server api data. My question is that I'm trying to design following code.

However yield put(get01Action(members)); which is commented out has following Syntax error.

A 'yield' expression is only allowed in a generator body.

I don't know how to manage it.

import '@babel/polyfill';
import { fork, take, put } from 'redux-saga/effects';
import axios from "axios";

export function* rootSaga(){
    yield fork(fetch01);
    yield fork(fetch02);
}

function* fetch01() {
    while (true){
        yield take('FETCH01_REQUEST');
        axios.get('/api/members')
            .then(function (response) {
                // handle success
                let members = response.data.data;
                // yield put(get01Action(members));
            })
            .catch(function (error) {
                // handle error
                console.log(error);
            })
            .finally(function () {
                // always executed
            });
    }
}
function* fetch02() {
    ....
}

function get01Action(members){
    return {
        type: 'GET_MEMBERS',
        member_id: 0,
        members: members
    }
}

Please give me some advice.

Thanks.

Answer 1

you can use call effect to make axios call and then you will be able to use put.

right now it's not working because you are using yield inside call back of promise.

function* fetch01() {
  while (true){
    try {
      yield take('FETCH01_REQUEST');
      const response = yield call(axios.get, '/api/members');
      yield put(get01Action(response.data.data))
    } catch(err) {
      console.error(err)
    }
}