File tree Expand file tree Collapse file tree 1 file changed +26
-0
lines changed Expand file tree Collapse file tree 1 file changed +26
-0
lines changed Original file line number Diff line number Diff line change @@ -285,6 +285,32 @@ This can be shortened even further. Just as non-specified content is assumed to
285
285
</current-user >
286
286
```
287
287
288
+ Note that the abbreviated syntax for default slot ** cannot** be mixed with named slots, as it would lead to scope ambiguity:
289
+
290
+ ``` html
291
+ <!-- INVALID, will result in warning -->
292
+ <current-user v-slot =" slotProps" >
293
+ {{ slotProps.user.firstName }}
294
+ <template v-slot:other =" otherSlotProps" >
295
+ slotProps is NOT available here
296
+ </template >
297
+ </current-user >
298
+ ```
299
+
300
+ Whenever there are multiple slots, use the full ` <template> ` based syntax for _ all_ slots:
301
+
302
+ ``` html
303
+ <current-user >
304
+ <template v-slot:default =" slotProps" >
305
+ {{ slotProps.user.firstName }}
306
+ </template >
307
+
308
+ <template v-slot:other =" otherSlotProps" >
309
+ ...
310
+ </template >
311
+ </current-user >
312
+ ```
313
+
288
314
### Destructuring Slot Props
289
315
290
316
Internally, scoped slots work by wrapping your slot content in a function passed a single argument:
You can’t perform that action at this time.
0 commit comments