prefer-destructured-store-props.md

pageClass	sidebarDepth	title	description
rule-details	0	svelte/prefer-destructured-store-props	destructure values from object stores for better change tracking & fewer redraws

svelte/prefer-destructured-store-props

destructure values from object stores for better change tracking & fewer redraws

• ❗ This rule has not been released yet.
• 💡 Some problems reported by this rule are manually fixable by editor suggestions.

📖 Rule Details

This rule reports on directly accessing properties of a store containing an object in templates. These usages can instead be written as a reactive statement using destructuring to allow for more granular change-tracking and reduced redraws in the component.

An example of the improvements can be see in this REPL

<script>
  /* eslint svelte/prefer-destructured-store-props: "error" */
  import store from "./store.js"
  $: ({ foo } = $store)
</script>

<!-- ✓ GOOD -->
{foo}

<!-- ✗ BAD -->
{$store.foo}

🔧 Options

Nothing

❤️ Compatibility

This rule was taken from @tivac/eslint-plugin-svelte.
This rule is compatible with @tivac/svelte/store-prop-destructuring rule.

🔍 Implementation

• Rule source
• Test source