我正在用 TypeScript 學習 Svelte。
我TS23在這段代碼中遇到了錯誤。
<script lang="ts">
import Test1 from './Test1.svelte';
import Test2 from './Test2.svelte';
let components = [
{ name: 'Test1', component: Test1 },
{ name: 'Test2', component: Test2 }
];
let selected;
</script>
{#each components as { name, component } (name)}
<label><input type="radio" value={component} bind:group={selected} />{name}</label>
{/each}
<svelte:component this={selected} />
型別 'typeof ComponentTest1__SvelteComponent_' 不可分配給型別 'string | 數量 | 細繩[]'。
型別 'typeof ComponentTest1__SvelteComponent_' 缺少來自型別 'string[]' 的以下屬性：pop、push、concat、join 等 28 個。ts(2322)
這個錯誤發生在標簽的value屬性中input。
我該如何處理？我真的不知道這個。
uj5u.com熱心網友回復：
Typescript 表示value單選輸入的屬性只能是字串、數字或字串數??組 ( string | number | string[])。假設name將是唯一的，您可以使用 name 作為值。這將需要更多的作業來將名稱映射回組件，但它非常少。
此示例將無線電輸入系結到selectedName，并設定一個反應式陳述句以在selectedName更新時查找關聯的組件。
<script lang="ts">
import Test1 from './Test1.svelte';
import Test2 from './Test2.svelte';
let components = [
{ name: 'Test1', component: Test1 },
{ name: 'Test2', component: Test2 }
];
let selectedName;
$: selected = components.find((c) => c.name === selectedName);
</script>
{selectedName}
{#each components as { name, component } (name)}
<label
><input type="radio" value={name} bind:group={selectedName} />{name}</label
>
{/each}
{#if selected}
<svelte:component this={selected.component} />
{/if}
轉載請註明出處，本文鏈接：https://www.uj5u.com/qianduan/373499.html
下一篇：向上箭頭不會變成向下箭頭