Comments (4)
I also have problems figuring out how to make async/await
working properly in effects.
It only works if I make the first function async:
getPosts: async (effects) => {
const result = await fetch('https://jsonplaceholder.typicode.com/posts')
const posts = await result.json()
return state => ({ ...state, posts })
}
But I haven't figured out how do I access state from inside of the effect.
Placing async
anywhere else screws up the state
from freactal.
Ah, I misunderstood you, @igorbarbashin. You're right. The first function needs to be async
.
It is because the effect signature can be Effects => State => State
or Effects => Promise<State => State>
. Since an async
function is the same as () => Promise<any>
then it fufill the latter case.
With that, my example can be rewritten like this:
const wrapComponentWithState = provideState({
initialState: () => ({
posts: null,
postsPending: false
}),
effects: {
setPostsPending: update((state, postsPending) => ({ postsPending })),
setPosts: update((state, posts) => ({ posts })),
getPosts: async effects => {
await effects.setPostsPending(true)
const result = await fetch('https://jsonplaceholder.typicode.com/posts')
const posts = await result.json()
await effects.setPostsPending(false)
return state => ({ ...state, posts })
}
}
})
from freactal.
As far as I can tell that is a bit of a a "dead zone" in effects. They can change and be aware of state in the final (state) => newState method.
There is a "hackish" way of doing this in two stages. it takes advantage of the fact that the final lambda (state) => newState) has acces to the effects from the outer closure AND the state from its own parameter:
effectA [ (effects, param) => ... ]
effectB [
(effects ?) =>
[
(state) =>
effects.effectA(state.foo)
return state (unchanged)
]
]
i.e., effectB gets a state value and calls effectA with it but does NOT return the promise resulting from the effectA call. It then returns state in whatever state its in.
This is a very jury-rigged way of having an effect pull a parameter from state but it will work.
Personally I'm fine with having states take parameters that I manually extract from state, as wherever I call an effect from will also have access to state.
from freactal.
@igorbarbashin It's probably because the foremost function can't return a promise but another function (the latter one can be async
)
from freactal.
Related Issues (20)
- state and effects
- middleware not executing in Jest
- Calculated states giving me the blues HOT 1
- A State Factory for Freactal
- Freactal doesn't work well with recursive state provider components. HOT 13
- A "Freactal Manager" module: Freactal Seed HOT 3
- effects.initialize executed version is unpatched through middleware.
- Putting up a Starter Kit with Freactal
- effects can't access parent scope
- Jumping cursor with controlled input HOT 1
- Looking for a new maintainer! HOT 15
- An alternative: looking glass engine
- Type codebase with flow HOT 3
- Any intention to support decorators? HOT 6
- Published package (v2.0.0) is out of sync with the actual code? HOT 15
- (Re-)Publish Freactal intro on Hacker Noon? HOT 3
- React Native database? HOT 2
- Injecting new state asynchronously HOT 6
- middleware
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from freactal.