[docs] Rename a variable `count_value` to `countValue` in the `Stores` section (#7180)

pull/7194/head
NazarLazarchuk 3 years ago committed by GitHub
parent 68dd118de0
commit e460acc8f1
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23

@ -4,14 +4,14 @@
import Decrementer from './Decrementer.svelte'; import Decrementer from './Decrementer.svelte';
import Resetter from './Resetter.svelte'; import Resetter from './Resetter.svelte';
let count_value; let countValue;
const unsubscribe = count.subscribe(value => { const unsubscribe = count.subscribe(value => {
count_value = value; countValue = value;
}); });
</script> </script>
<h1>The count is {count_value}</h1> <h1>The count is {countValue}</h1>
<Incrementer/> <Incrementer/>
<Decrementer/> <Decrementer/>

@ -4,14 +4,14 @@
import Decrementer from './Decrementer.svelte'; import Decrementer from './Decrementer.svelte';
import Resetter from './Resetter.svelte'; import Resetter from './Resetter.svelte';
let count_value; let countValue;
count.subscribe(value => { count.subscribe(value => {
count_value = value; countValue = value;
}); });
</script> </script>
<h1>The count is {count_value}</h1> <h1>The count is {countValue}</h1>
<Incrementer/> <Incrementer/>
<Decrementer/> <Decrementer/>

@ -4,14 +4,14 @@
import Decrementer from './Decrementer.svelte'; import Decrementer from './Decrementer.svelte';
import Resetter from './Resetter.svelte'; import Resetter from './Resetter.svelte';
let count_value; let countValue;
count.subscribe(value => { count.subscribe(value => {
count_value = value; countValue = value;
}); });
</script> </script>
<h1>The count is {count_value}</h1> <h1>The count is {countValue}</h1>
<Incrementer/> <Incrementer/>
<Decrementer/> <Decrementer/>

@ -4,7 +4,7 @@ title: Writable stores
Not all application state belongs inside your application's component hierarchy. Sometimes, you'll have values that need to be accessed by multiple unrelated components, or by a regular JavaScript module. Not all application state belongs inside your application's component hierarchy. Sometimes, you'll have values that need to be accessed by multiple unrelated components, or by a regular JavaScript module.
In Svelte, we do this with *stores*. A store is simply an object with a `subscribe` method that allows interested parties to be notified whenever the store value changes. In `App.svelte`, `count` is a store, and we're setting `count_value` in the `count.subscribe` callback. In Svelte, we do this with *stores*. A store is simply an object with a `subscribe` method that allows interested parties to be notified whenever the store value changes. In `App.svelte`, `count` is a store, and we're setting `countValue` in the `count.subscribe` callback.
Click the `stores.js` tab to see the definition of `count`. It's a *writable* store, which means it has `set` and `update` methods in addition to `subscribe`. Click the `stores.js` tab to see the definition of `count`. It's a *writable* store, which means it has `set` and `update` methods in addition to `subscribe`.

@ -4,14 +4,14 @@
import Decrementer from './Decrementer.svelte'; import Decrementer from './Decrementer.svelte';
import Resetter from './Resetter.svelte'; import Resetter from './Resetter.svelte';
let count_value; let countValue;
count.subscribe(value => { count.subscribe(value => {
count_value = value; countValue = value;
}); });
</script> </script>
<h1>The count is {count_value}</h1> <h1>The count is {countValue}</h1>
<Incrementer/> <Incrementer/>
<Decrementer/> <Decrementer/>

@ -8,7 +8,7 @@ Start by declaring `unsubscribe` in `App.svelte`:
```js ```js
const unsubscribe = count.subscribe(value => { const unsubscribe = count.subscribe(value => {
count_value = value; countValue = value;
}); });
``` ```
> Calling a `subscribe` method returns an `unsubscribe` function. > Calling a `subscribe` method returns an `unsubscribe` function.
@ -23,16 +23,16 @@ You now declared `unsubscribe`, but it still needs to be called, for example thr
import Decrementer from './Decrementer.svelte'; import Decrementer from './Decrementer.svelte';
import Resetter from './Resetter.svelte'; import Resetter from './Resetter.svelte';
let count_value; let countValue;
const unsubscribe = count.subscribe(value => { const unsubscribe = count.subscribe(value => {
count_value = value; countValue = value;
}); });
onDestroy(unsubscribe); onDestroy(unsubscribe);
</script> </script>
<h1>The count is {count_value}</h1> <h1>The count is {countValue}</h1>
``` ```
It starts to get a bit boilerplatey though, especially if your component subscribes to multiple stores. Instead, Svelte has a trick up its sleeve — you can reference a store value by prefixing the store name with `$`: It starts to get a bit boilerplatey though, especially if your component subscribes to multiple stores. Instead, Svelte has a trick up its sleeve — you can reference a store value by prefixing the store name with `$`:

Loading…
Cancel
Save