# svelte/valid-each-key

enforce keys to use variables defined in the {#each} block

# 📖 Rule Details

This rule reports that {#each} block keys does not use the variables which are defined by the {#each} block.

<script>
  /* eslint svelte/valid-each-key: "error" */

  let things = [
    { id: 1, name: 'apple' },
    { id: 2, name: 'banana' },
    { id: 3, name: 'carrot' },
    { id: 4, name: 'doughnut' },
    { id: 5, name: 'egg' }
  ];
  let foo = 42;
</script>

<!-- ✓ GOOD -->
{#each things as thing (thing.id)}
  <Thing name={thing.name} />
{/each}

<!-- ✗ BAD -->
{#each things as thing (
Expected key to use the variables which are defined by the `{#each}` block. (svelte/valid-each-key)foo)}
  <Thing name={thing.name} />
{/each}

# 🔧 Options

Nothing.

# 👫 Related Rules

• svelte/require-each-key

# 📚 Further Reading

• Svelte - Tutorial > 4. Logic / Keyed each blocks

# 🚀 Version

This rule was introduced in eslint-plugin-svelte v2.28.0

# 🔍 Implementation

• Rule source
• Test source