React only docs section
This section is required only if you use statek with React. If you want to use plain version of statek, feel free to skip this chapter
This section uses parts of the code created in previous tutorial parts.
Now as our store is created and have some helpers methods attached, we can create React component that will read from it and update itself each time used value changes.
Let's start by creating simple
Todos component that shows todos count
Note that we've wrapped our component function inside
Each component using the store has to be wrapped with
Exception from this rule is covered in 3rd-party components section
Now let's add a new todo to our store
after we do this,
Todos view will re-render showing new count!
Changing store inside the component
Our view can modify the store during some event etc. exactly the same way as we would modify the store outside of the component:
Nested components using the same store
Todo component that will display single todo info inside our Todos component
Now, if we'll modify only one task:
<Todo /> component that rendered Todo with id
1 will re-render.
Todos component itself will not re-render as this change didn't impact them.
View components are automatically