derived
を使用して、1つまたはそれ以上の 他の store に基づいた値の store を作成することができます。前の例を利用して、ページが開かれている時間を取得する store を作成することができます。
stores.js
export const elapsed = derived(
time,
($time) => Math.round(($time - start) / 1000)
);
複数の input store から derived store を作成したり、値を返す代わりに
set
を使用して明示的に値をセットすることができます。(これは非同期で値を取得する場合に役立ちます。)詳細については API リファレンス を参照してください。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<script>
import { time, elapsed } from './stores.js';
const formatter = new Intl.DateTimeFormat(
'en',
{
hour12: true,
hour: 'numeric',
minute: '2-digit',
second: '2-digit'
}
);
</script>
<h1>The time is {formatter.format($time)}</h1>
<p>
This page has been open for
{$elapsed}
{$elapsed === 1 ? 'second' : 'seconds'}
</p>