Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Reactive declarations can not depend on const "variables" (svelte v3) #2285

Closed
arnargisla opened this issue Mar 21, 2019 · 5 comments · Fixed by #2398 or #2631
Closed

Reactive declarations can not depend on const "variables" (svelte v3) #2285

arnargisla opened this issue Mar 21, 2019 · 5 comments · Fixed by #2398 or #2631
Labels
Milestone

Comments

@arnargisla
Copy link

This is in svelte version 3.

Reactive declarations can not depend on const "variables", even though the variable is declared as const, its properties can still change.

// This works
<script>
	let obj = {
		prop: 10
	}
	$: reactiveDecl = obj.prop;
</script>

<h1>{reactiveDecl}</h1>

vs

// Error "Invalid reactive declaration — must depend on local state ..."
<script>
	const obj = {
		prop: 10
	}
	$: reactiveDecl = obj.prop;
</script>

<h1>{reactiveDecl}</h1>
@thollander
Copy link
Contributor

I can't reproduce the issue in REPL.

Could you provide a link with the error ?

@Conduitry
Copy link
Member

@thollander Your link is using a rather old alpha of v3 from over a month ago. https://v3.svelte.technology/repl?version=3.0.0-beta.20&gist=cb6444292dfa437bbf9d094c33bbe8a0 The error message does happen with the latest beta.

@Rich-Harris Rich-Harris added this to the 3.0 milestone Mar 27, 2019
@Rich-Harris
Copy link
Member

Marking this as a bug. It's often desirable to have 'reactive' properties that depend on static values, for aesthetic purposes as much as anything else:

// fixed
const padding = 20;

// changeable
let width = 100;
let height = 100; 

$: x1 = padding; // invalid
$: x2 = width - padding;
$: y1 = padding; // invalid
$: y2 = height - padding;

@voliva
Copy link

voliva commented Apr 25, 2019

@Rich-Harris I think this should be reopened - Although reactive declarations can now depend on const variables, there are cases where in runtime an error will get thrown:

https://svelte.dev/repl?version=3.0.1&gist=cdd9c11865f84480e7e22d828909da15

In this example, it seems like list doesn't get evaluated (so... defined) unless the variable is not set as a const OR there's another reactive declaration that depends on it.

If it's used directly in the template, then it doesn't get defined and we get the runtime error.

In this example I declared the variable as a nested object just to show another use case, but the same thing happens for a static const value (just replace everything for const count = 3, removing the button that increments it)

@Rich-Harris
Copy link
Member

you're right, that's weird — reopening

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
5 participants