Language-tools: Jedes Problem mit der Blocktypisierung

Erstellt am 3. Jan. 2021 · 5Kommentare · Quelle: sveltejs/language-tools

Ich versuche, mithilfe von {#each ...} über Eigenschaftenwerte zu iterieren, und meine Svelte-Komponente enthält zwei Typisierungen (dies ist ein TypeScript-Projekt).

<script lang="ts">
    import Transition from './Transition/Transition.svelte';

    type Options = { text: string, value?: string }[];
    type OptionsGroup = Options[];

    export let options: Options | OptionsGroup = [];
</script>

{#each options as option}
    <div>example</div>
{/each}

Ich würde erwarten, dass die Art der Option in jeder Anweisung Options | OptionsGroup aber VS Code gibt mir einen Fehler mit den Worten:

Argument vom Typ 'Optionen | OptionsGroup 'kann keinem Parameter vom Typ' ArrayLike <{text: string; Wert?: Zeichenfolge; }> '.

Ich bin mir nicht sicher, was genau falsch läuft, da die Build- und Dev-Tasks ohne Fehler einwandfrei funktionieren. Es scheint nur ein Problem mit VS Code zu sein.

System:

Betriebssystem: Manjaro (Linux)
IDE: VSCode
Plugin / Paket: Svelte für VSCode

bug question

Quelle

JAD3N

Alle 5 Kommentare

Ich habe auch einen seltsamen Fehler mit {#each} .

Kleinstmögliche Reproduktion:

<script lang="ts">
  let data: { name: string } | null = null,
    someArr = [1, 2, 3];
</script>

{#if data}
  <!-- Works fine -->
  {data.name}
  {#each someArr as _}
    <!-- Highlights an error! -->
    {data.name}
  {/each}
{/if}

Mac, VS Code, mit dem neuesten Plugin. Ich habe das Gefühl, dass es etwas mit diesem Problem zu tun hat.

Proof of bug

dkzlv am 5. Jan. 2021

@dkzlv das ist # 619

dummdidumm am 5. Jan. 2021

👍1

Ich befürchte, dass dies auf unserer Seite nicht behoben werden kann. Es scheint sich um ein TypeScript-Problem zu handeln. Sie würden den gleichen Fehler erhalten, wenn Sie dies tun:

function each<T>(
    array: ArrayLike<T>, // or T[], doesnt matter for the error
    callbackfn: (value: T, index: number) => any
): any{ /* doesnt matter */ };

each(options, a => a); // The same TS error

Diese each -Funktion wird im Grunde genommen verwendet, um den each -Block zu tippen. Ich habe keinen Weg gefunden, den Fehler zum Schweigen zu bringen, ohne die Typensicherheit zu verlieren.

dummdidumm am 6. Jan. 2021

Sie können dies stattdessen tun. Ich glaube, ich habe diesen Typoskript-Fehler schon einmal und habe ihn durch Ausprobieren einer zufälligen Kombination lol zum Laufen gebracht

<script lang="ts">
  type Option = { text: string, value?: string };
  type OptionsGroup = Option[];

  export let options: Array<Option | OptionsGroup> = [];
</script>

{#each options as option}
  <div>example</div>
{/each}

Bearbeiten:
Beachten Sie, dass diese beiden Typen nicht gleich sind, aber Sie kümmern sich wahrscheinlich die meiste Zeit nicht um den Unterschied. Wenn Sie sich interessieren, müssen Sie wahrscheinlich einen benutzerdefinierten Typschutz schreiben, um ihn zu wirken.

jasonlyu123 am 6. Jan. 2021

Vielen Dank für die Klarstellung, ich habe meine Eingaben wie empfohlen geändert und das hat es so ziemlich gelöst.

JAD3N am 6. Jan. 2021

👍1

War diese Seite hilfreich?

0 / 5 - 0 Bewertungen

Language-tools: Jedes Problem mit der Blocktypisierung

Alle 5 Kommentare

Verwandte Themen