The function in the lifecycle hooks is called only 1 time

[morlz]

Version

3.2.20

Reproduction link

jsfiddle.net/fdympu39/

Steps to reproduce

In the fiddle, press the toggle button 4 times

What is expected?

Mounted callback calls 2 times.
Unmounted callback calls 2 times.

What is actually happening?

Mounted callback calls 1 times.
Unmounted callback calls 2 times.

[posva]

You probably figured it out but, as a workaround, pass a new function each time.

[LinusBorg]

Are we sure this is a bug and was not a design decision?

[posva]

I'm honestly not sure and I also think it could be a design decision 😬

[wellrus]

At first glance, it looks like vue can't work correctly when using a function reference. For example: two components share a common function. Or, for example, inside one component, one function is used in two different hooks.

The reason is in the function: injectHook. Since the __weh function is reused.

Using the same function in different hooks causes __weh to use the data from the closure.

Why it needs to be fixed:

1. The documentation does not indicate that the programmer cannot use functions by reference in hooks
2. Memory consumption increases
3. There is no message that the hook already contains a link to the __weh function
4. complicates the reuse of functions
5. The callWithAsyncErrorHandling function is called with data from the closure and the arguments for different types of hooks are incorrect

[GeoffreyParrier]

This issue seems to be fixed since 3.2.40

Repros to helps checking that:
3.2.39 (not working): https://jsfiddle.net/bpvgy4xo/
3.2.40 (working): https://jsfiddle.net/bpvgy4xo/1/

[GeoffreyParrier]

@KazariEX thanks
Maybe close #5176 as it was only there to fix this issue