15 Matching Annotations
- Sep 2024
-
stackoverflow.com stackoverflow.com
-
I emphatically disagree with BlueFish about observers being difficult to properly unit test. This is precisely the biggest point that distinguishes them from lifecycle callbacks: you can test observers in isolation, and doing so discourages you from falling into many of the state- and order-heavy design pitfalls BlueFish refers to (which again I think is more often true of lifecycle callbacks).
-
- Nov 2021
-
stackoverflow.com stackoverflow.com
-
In effect, the $ syntax we've seen above will actually setup a subscription to the store. And the subscription will be cancelled when the component is destroyed. If the store is subscribed by multiple components, the store will be disposed only when the last component unsubscribes (it will be reinitialized, if a new subscription is made). This is very handy to manage the lifecycle of disposable things in your code.
-
- Mar 2021
-
api.rubyonrails.org api.rubyonrails.org
-
Third configurable block to run.
I like how they identify in the description which order things run in: 1st, 2nd, 3rd, and last.
Though, it would be more readable to have a list of them, in chronological order, rather than having them listed in alphabetical order.
-
Last configurable block to run. Called after frameworks initialize.
-
- Jan 2021
-
github.com github.com
-
What I think is happening is that instantiating the component is immediately running the $: reactive code, which dispatches the event synchronously, before the parent component attaches the listener.
-
-
medium.com medium.com
-
Knowing exactly what happens in your application can mean the difference between feeling in full control or experiencing deep frustration. Personally, unknowns drive me crazy, which in turn often leads to all sorts of experiments and/or debug sessions.
-
-
svelte.dev svelte.dev
-
beforeUpdate(async () => { console.log('the component is about to update'); await tick(); console.log('the component just updated'); });
-
- Oct 2020
-
formvalidation.io formvalidation.io
-
The best place to initialize a FormValidation instance is inside the component's onMount event:
Why? Presumably because it needs access to a form element (
document.getElementById('loginForm')
)...
-
-
dylanvann.com dylanvann.com
-
To fix our Svelte version you might think we could use beforeUpdate or afterUpdate, but these lifecycle functions are related to the DOM being updated, not to prop updates. We only want to rerun our fetching when the album prop is changed.
-
-
github.com github.com
-
Svelte doesn't re-render, so you need to respond to component mount/dismount and prop changes separately as they are distinct concepts and never tied together, unlike in React.
Tags
- UI library: reacting to prop changes
- trying to doing things the same way you did in a different library/framework (learning new way of thinking about something / overcoming habits/patterns/paradigms you are accustomed to)
- different way of thinking about something
- lifecycle callbacks
- distinction
Annotators
URL
-
- Sep 2020
-
stackoverflow.com stackoverflow.com
-
Other lifecycle functions are onMount, onDestroy, etc. It is arguably less obvious that setContext is such a lifecycle method.
-
-
stackoverflow.com stackoverflow.com
-
onMount(() => { async function foo() { bar = await baz(); } foo();
-
(Note that you're responsible for handling any race conditions that arise as a result of the component being destroyed before the promise resolves, though assigning state inside a destroyed component is harmless.)
-
-
daveceddia.com daveceddia.com
-
With useEffect, you can handle lifecycle events directly inside function components. Namely, three of them: componentDidMount, componentDidUpdate, and componentWillUnmount. All with one function!
-
- Aug 2020
-
svelte.dev svelte.dev
-
It's recommended to put the fetch in onMount rather than at the top level of the <script> because of server-side rendering (SSR). With the exception of onDestroy, lifecycle functions don't run during SSR, which means we can avoid fetching data that should be loaded lazily once the component has been mounted in the DOM.
-