Skip to content
This repository has been archived by the owner on Dec 9, 2021. It is now read-only.

[Question] How to make post request #44

Open
TheElegantCoding opened this issue Jul 9, 2021 · 1 comment
Open

[Question] How to make post request #44

TheElegantCoding opened this issue Jul 9, 2021 · 1 comment

Comments

@TheElegantCoding
Copy link

TheElegantCoding commented Jul 9, 2021

I use this arquicteture of redux in my projects and is awesome, but how you handle the post, update or delete request.

when you do a post request and need when is complete, the state by default is false because is not dispatching any action so you don't know when the status of the post request is 'idle' or is 'success for example:

const PostIsLoading = useSelector((state) => SelectRequesting(state, [PostAction.REQUEST_POST]));

    const PostandClose = () =>
    {
        dispatch(PostAction.PostSomething());
    }

    if(!PostIsLoading )
    {
          // do something when post end
    }

so by default this if condition is true because is not loading and will trigger by default, I suggest adding an 'idle' state so we can know the post action is idle and when is 'success'


    if(PostIsLoading  === 'Idle')
    {
          // Here the action is idle and is dispatch anything
    }

    if(PostIsLoading  === 'loading')
    {
          // Here the action is loading
    }

    if(PostIsLoading  === 'Success')
    {
          // do something when post end
    }

i don't know too much of redux so sorry if there is another way to do this easier

There is another question whit this problem, how this structure is done i think we can pass diferrent actions to the selector like this

const PostIsLoading = useSelector((state) => SelectRequesting(state, [PostAction.REQUEST_POST, PostAction_2.REQUEST_POST_2]));

this doesn't make any error but if we put a button that dispatch the second action, this makes the loading of the first action 'true', for example


const Category = useSelector((state) => state.CategoryReducer.Category);
const Country = useSelector((state) => state.CountryReducer.Country);
const PostIsLoading = useSelector((state) => SelectRequesting(state, [PostAction.REQUEST_POST, PostAction_2.REQUEST_POST_2]));


    useEffect(() =>
    {
        dispatch(PostAction.PostSomething());
    }, [dispatch])

    const Post_2 = () =>
    {
        dispatch(PostAction_2.PostSomething_2());
    }

    return (  
        <>
              {
                  PostIsLoading 
                  ?
                  <h1>Loading bro</h1>
                  :
                  <h1>{Category[0]?.Category}</h1>
              }
              {
                   PostIsLoading 
                    ?
                    <h1>Loading bro</h1>
                    :
                    <h1>{Country[0]?.Country}</h1>
              }
              <button onClick={Post_2 }> post me</button>
        </>
)

When you click to dispatch the action make all load even if the first action on the useEffect is finished, this doesn't trigger the action but the loading doesn't work properly and render for both of them, the easy solution is to make two variables, but I think this lose sense because we pass an array and all the time will contain only one element

const PostIsLoading = useSelector((state) => SelectRequesting(state, [PostAction.REQUEST_POST,]));
const Post_2IsLoading = useSelector((state) => SelectRequesting(state, [PostAction_2.REQUEST_POST_2]));

@TheElegantCoding TheElegantCoding changed the title How to make post request [Question] How to make post request Jul 9, 2021
@codeBelt
Copy link
Owner

Sorry, I've been busy and now I will be away from my computer for two weeks.

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants