Actions & Reducers
Last updated
Was this helpful?
Last updated
Was this helpful?
ConanJs allows to interact with the state by using Actions & Reducers.
Reducers are used to update the underlying data and must be prefixed with the symbol ‘$’
Reducers are not meant to be accessed by users of the State (actions are).
ConanJs will create an action for each reducer automatically.
Always add the $ to your reducer name, if you do so, the framework will create a matching action without the $ (unless you override it)
Actions are automatically created or provided to add additional logic. They serve as interfaces to increase state reusability and are also
Actions make up the public API through which your Conan State can be used.
Defaults reducers and default actions are always available when a state is created with Conan.
Sync
Async
Reducers
$update
-
Actions
update
updateAsap
Both update and $update can receive either:
A value to use as new state,
A reducer function to provide a new value based on its current value.
Each Conan State will have a clear actions interface which can help to see each ConanState as an injectable capsule of behaviour.
In your UI you can declare what type of state your component is going to be receiving, and decide its actual implementation.
It might be difficult at first to decide how to shape your Conan State, including its reducers and actions.
To help you decide we provide with the following guidelines.
4- If you need to add async actions, auto-bind them if possible. Auto binding removes boilerplate code by using a name convention to tie an async operation with its matching reducer.
UpdateAsap receives an
You can see our '' showcasing the usage of the default actions.
To learn more about reducers, how to define them, and the default reducer, check out our .
To learn more about actions, how to define them, their return value, and the default actions, check out our .
Combined with allows developers to think of state as configurable and injected logic.
You can see this in our and examples, where the todo list renderer does not fundamentally change even though one has async actions.
Invoking actions is very simple, they are all available under the 'do' property for the state
1- Create the smallest Conan State that you possibly can. The best way to do this is to leverage the and start by not creating any reducers or actions, but just use the out of the box actions update and updateAsap. You could have state that represents units of information, like, a list of todos, the current filter to use for an action... Then, in your views, if you need to combine them, user our You could also further leverage , to have all these states already prebuilt and injected.
2- If you need to add more logic, choose creating a reducer first. Creating is simpler than creating , and ConanJs will automatically generate an action for you.
3- If you need to have a few actions being triggered once after another, of conditionally, see if you can first. With ConanJs you can react to changes in a different state
5- If you need to add async actions that can't be auto-bind, use a monitor action. Monitors allow you to connect async to reducers easily
6- Create custom actions when you need to add additional logic or override an action. This is fully explained in the section