slot with slot-scope cannot be accessed via $slots
See original GitHub issueVersion
2.5.17
Reproduction link
Steps to reproduce
Create a component with slot
<template>
<div>
<slot></slot>
</div>
</template>
<script>
export default {
name: 'TestComponent',
created () {
console.log(this.$slots.default)
}
}
</script>
Use it with two slot components, one has slot-scope
attribute and the other one do not
<template>
<test-component>
<p slot-scope="props">1</p>
<p>2</p>
</test-component>
</template>
Then will found this.$slots.default
can only access the second VNode.
And if we removed slot-scope
attribute from the first
element, both of them shows in this.$slots.default
.
What is expected?
I’m not sure whether this is the limitation of slot-scope
and is there any other methods to get slot VNode with slot-scope
?
What is actually happening?
cannot access slot with slot-scope
Issue Analytics
- State:
- Created 5 years ago
- Comments:7 (3 by maintainers)
Top Results From Across the Web
Access this.$slots while using v-slot (scoped-slot)
$slots being empty and breaking my code. How is it possible to access the DOM element of a slot that is using a...
Read more >Slots - Vue.js
Scoped Slots As discussed in Render Scope, slot content does not have access to state in the child component. However, there are cases...
Read more >Understanding scoped slots in Vue.js - Binarcode
A scoped slot is a special type of slot that functions as a reusable template (that can be passed data to) instead of...
Read more >Using Slots In Vue.js - Smashing Magazine
To get access to the data passed to the slot, we specify the name of the scope variable with the value of the...
Read more >How To Use Scoped Component Slots in Vue.js - DigitalOcean
For example, "firstScope" , properties passed into the <slot> will be accessible as {{firstScope.exampleProperty}} while secondScope" will be ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
Scoped slots are exposed via
this.$scopedSlots
.Yes, this is a good alternative I have already try, just trying to provide some more straightforward API.
Thanks a lot.