如何在Sveltekit 1.0中每10秒更新JSON数据?

Question

需要将代码从旧的sveltekit转换为新的sveltekit 1.0。

我曾经使用onMount,onDestroy,setInterval来重新获取数据，但我认为它在sevltekit 1.0中已被弃用。

索引。sveltekit(旧版本)

<script>
import { onMount, onDestroy } from "svelte"; 
let listH = [];  
let listH_interval = [];    
onMount(async function getData() {  
const response = await fetch("https://jsonplaceholder.typicode.com/todos/");
listH = await response.json();   
listH_interval = setInterval(getData, 74000); 
}); 
onDestroy(() => clearInterval(listH_interval)); 
</script>
<pre>{JSON.stringify({listH}, null, 2)}</pre>

+页面。sveltekit (v1.0)

<script>
import { onMount, onDestroy } from "svelte"; 
export let data;
const { listH} = data;
</script>
<pre>{JSON.stringify({listH}, null, 2)}</pre>

+ page.js (v1.0)

<script>
onMount(async function getData() {  
const response = await fetch("https://jsonplaceholder.typicode.com/todos/");
listH = await response.json();   
listH_interval = setInterval(getData, 74000); 
}); 
onDestroy(() => clearInterval(listH_interval)); 
</script> 

我知道+page.js没有任何意义。

Answer 1

你应该使用setInterval和clearInterval

<script>
import { onMount, onDestroy, setInterval, clearInterval } from "svelte";
export let data;
const { listH } = data;
</script>

将onMount和onDestroy函数从page.js文件移到page。

使用setInterval和clearInterval函数。

<script>
import { onMount, onDestroy, setInterval, clearInterval } from "svelte";
export let data;
const { listH } = data;
let listH_interval;
onMount(async function getData() {
const response = await fetch("https://jsonplaceholder.typicode.com/todos/");
listH = await response.json();
listH_interval = setInterval(getData, 74000);
});
onDestroy(() => clearInterval(listH_interval));
</script>

也可以删除索引。sveltekit文件(新版本的sveltekit不需要)