输入 svelte $store 变量

Question

我想知道是否可以取消键入自定义 svelte 商店的美元符号值？

来自 this example :

app.svelte

<script>
    import { count } from './stores.js';
</script>

<h1>The count is {$count}</h1>

<button on:click={count.increment}>+</button>
<button on:click={count.decrement}>-</button>
<button on:click={count.reset}>reset</button>

stores.js

import { writable } from 'svelte/store';

function createCount() {
    const { subscribe, set, update } = writable(0);

    return {
        subscribe,
        increment: () => {},
        decrement: () => {},
        reset: () => {}
    };
}

export const count = createCount();

如何使用您自己的打字稿界面键入变量 {$count}？

感谢您的帮助

Answer 1

您可以将 stores.js 重命名为 stores.ts 并添加类型，例如：

import { Writable, writable } from "svelte/store"

type CountStore = {
  subscribe: Writable<number>["subscribe"]
    
  increment: () => void
  decrement: () => void
  reset: () => void
}

function createCount(): CountStore {
.
.
.

---

编辑：

您不需要定义类型，Typescript 做得很好，所以您只需将原始文件从 js 重命名为 ts。