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)

);