Set a value to a Svelte 3 store

Tomasz Łakomy
InstructorTomasz Łakomy
Share this video with your friends

Social Share Links

Send Tweet

Sometimes we don't want to have a complicated update function to change a value of our store. We know exactly what we want to change the value to - we can just use the store.set function to do that.

In this lesson we're going to learn how to set a value to a Svelte 3 store by using the store.set function to set the value of a counter without having to increment/decrement it one by one.

Instructor: [0:00] We have an app with incrementer and decrementer components connected to the store. Whenever I click the button, the countValue is going to be updated.

[0:07] What we'd like to achieve is that instead of being clicking 10 times to get the number 15, I would like to input the number 15 over here and just update the count to 15.

[0:16] In order to do that, let's go to this Setter.svelte component. Here, import store from store. Store has a set method. With that, we can use to achieve this effect.

[0:29] What I am going to do now is that I am going to run store.set(event.target.value). If I save that, we have the desired effect. If I type in the number 20 over here, I can always set the count to 20. Of course, both decrementic and incrementic value still works.