Quản lý Side Effects với Redux-Saga (Phần 1) – Trang Chủ

// saga.js

import

{

take

,

put

,

call

}

from

‘redux-saga/effects’

1.

function

*

mySaga

(

)

{

2.

  

while

(

true

)

{

3.

    

yield

take

(

USER_INTERACTED_WITH_UI_ACTION

)

;

4.

    

yield

put

(

SHOW_LOADING_ACTION

,

{

isLoading

:

true

}

)

;

5.

    

const

data

=

yield

call

(

GET

,

‘https://my.server.com/getdata’

)

;

6.

    

yield

put

(

SHOW_DATA_ACTION

,

{

data

:

data

}

)

;

7.

  

}

8.

}

// reducer.js

.

.

.

case

SHOW_LOADING_ACTION

:

(

state

,

isLoading

)

=&

gt

;

{

    

return

Object

.

assign

(

{

}

,

state

,

{

showLoading

:

isLoading

}

)

;

}

,

case

SHOW_DATA_ACTION

:

(

state

,

data

)

=&

gt

;

{

    

return

Object

.

assign

(

{

}

,

state

,

{

data

:

data

,

showLoading

:

false

}

;

}

.

.

.