title: Request failing when trying to pass in parameters in redux-saga for an api call
body: <p>The problem is that I am trying to pass in parameters for a api request using redux-saga, but I am getting this error in the browser console: <code>GET https://jsonplaceholder.typicode.com/posts/[object%20Object] 404</code>. I have already performed console.log(data) in the try block of handleGetPost function, and I getting an object as a response, hence that works just fine. Can anyone point out what am I doing wrong here.</p>
  <p><strong>Edit</strong>
  according to @Daniel Duong, console.log(id) prints out an object that gets passed again into the saga. So how can I pass in a parameter to url, then retrieve the data and store the data inside the state (or store) using redux-saga?</p>
  <p>Here is the code:</p>
  <p><strong>FetchPost.js</strong></p>
  <pre><code>  const idRef = useRef(null);
    const dispatch = useDispatch();
  
    const handleSubmit = (event) =&gt; {
      event.preventDefault();
      dispatch(getPost(idRef.current.value));
    };
  
    return (
      &lt;&gt;
        &lt;input type='text' ref={idRef} name='id' /&gt;
        &lt;button type='submit' onClick={handleSubmit}&gt;
          Submit
        &lt;/button&gt;
      &lt;/&gt;
    );
  }; 
  </code></pre>
  <p><strong>getPost.js</strong></p>
  <pre><code>const GET_POST = 'GET_POST';
  
  const initialState = {
    post: '',
  };
  
  const getPost = (id) =&gt; ({
    type: GET_POST,
    id,
  });
  
  const fetchPostReducer = (state = initialState, action) =&gt; {
    switch (action.type) {
      case GET_POST:
        return { ...state, post: action.id };
  
      default:
        return state;
    }
  };
  
  export { getPost, GET_POST };
  export default fetchPostReducer;
  </code></pre>
  <p><strong>sagas.js</strong></p>
  <pre><code>export function requestGetPost(id) {
    return axios.request({
      method: 'get',
      url: `https://jsonplaceholder.typicode.com/posts/${id}`,
    });
  }
  
  function* handleGetPost(action) {
    try {
      const response = yield call(requestGetPost, action.id);
      const { data } = response;
      yield put(getPost(data));
    } catch (error) {
      console.log(error);
    }
  }
  
  export function* watcherSaga() {
    yield takeLatest(GET_POST, handleGetPost);
  }
  </code></pre>