Sveltestores派生

Svelte stores派生

你可以创建一个stores，其内的值可以派生(derived)于一个或多个 其他 stores。在前面的示例的基础上，我们可以创建派生时间到其他页面：export const elapsed = derived(

time,

$time => Math.round(($time - start) / 1000)

);可以从多个源派生​stores​， 并显式用​​set​​指定它的值而不是返回它（这对异步调用的派生值很有用)。 更多请查阅API 参考 。示例代码App.svelte<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>stores.jsimport { readable, derived } from 'svelte/store';

export const time = readable(new Date(), function start(set) {

const interval = setInterval(() => {

set(new Date());

}, 1000);

return function stop() {
    clearInterval(interval);
};

});

const start = new Date();

export const elapsed = derived(

time,

$time => Math.round(($time - start) / 1000)

);