In certain cases, the view fails to update properly

[hickiy]

Vue version

3.4.30

Link to minimal reproduction

https://stackblitz.com/~/github.com/hickiy/vuedemo

Steps to reproduce

First start the project, you will find that when you click the fold away button, the red border cannot be updated properly. When you switch to app2.vue in main.js, you will find that everything is normal, in fact, the two usage methods should be equivalent

What is expected?

You can update the view normally in both cases, or explain why this happens

What is actually happening?

When the value of a bound reactive variable changes, the border does not update properly

System Info

Version: 1.90.2 (system setup)
Commit: 5437499feb04f7a586f677b155b039bc2b3669eb
Date: 2024-06-18T22:34:26.404Z
Electron: 29.4.0
ElectronBuildId: 9728852
Chromium: 122.0.6261.156
Node.js: 20.9.0
V8: 12.2.281.27-electron.0
OS: Windows_NT x64 10.0.19045

Any additional comments?

No response

[hickiy]

In the demo, I found that when the childComponent uses a render function without build-in component "slot", both the "app" and the "app2" work fine.

[yangxiuxiu1115]

You should not manually change the value of slot.default, this will cause problems with some of the compilation optimization strategies that vue does internally. For example, in app.vue the default slot will have the identifier STABLE added to it, and when you change slot.default the identifier will cause it to go into optimization, whereas in app2.vue it won't be a problem because there's no compilation optimization for it in jsx.

[yangxiuxiu1115]

When you add ctx.slots._ = undefined to wrapForm.jsx, everything will revert back to normal

[hickiy]

When you add ctx.slots._ = undefined to wrapForm.jsx, everything will revert back to normal

thanks for your answer, l don't understand that what is the function of ctx.slots._ , so I will look at the source code and thank you agin

Whether because, when slots._ = STABLE, its update will be skip