Questions tagged [vuejs-slots]
63 questions
7
votes
0 answers
VueJS - Apply styles to slots wrapping elements
I want to create a Card component using vue that has a header and content section using the vuejs slots api.
I am having trouble understanding how I can create a structure in my Card component. The card should contain all the wireframe styles…
synthet1c
- 6,152
- 2
- 24
- 39
7
votes
1 answer
How to access child component's reactive data in a slot?
Currently, I have a parent component, which renders a child component, and also passes a component (a modal, called Modal.vue) into the child as a slot.
Parent.vue
peterjwolski
- 153
- 2
- 10
6
votes
1 answer
VueJS slots not working with Stencil JS components?
I have a Vue 3 application, and a StencilJS component library. One of my Stencil components used a default slot earlier, and it worked well with Vue. Now I introduced named slots in my Stencil component, but the named slots aren't working from Vue…
Rutwick Gangurde
- 4,772
- 11
- 53
- 87
6
votes
1 answer
Get slot data as a variable in Vue?
I have a component (prism-editor) that only takes code from v-model="code". This means, the code has to be sent to the component through code:
Code.vue
nowox
- 25,978
- 39
- 143
- 293
4
votes
1 answer
Dynamically create a component in Vue JS
I need to create a component in Vue JS dynamically on click and then route to that component. I am using Vue 3. Everything needs to happen in one click.
My code looks something like this
methods:{
routerClick(value){
console.log("number is…
Samanja Cartagena
- 115
- 1
- 10
4
votes
2 answers
VueJS 3: Access root HTML element in a slot
how do I reliably access the root HTML element in a slot? I tried slots.default()[0].el but its not consistent. I realized if the slot is a simple html, it is not null, which is great, but if it has some vue directives or components, it will be…
icube
- 2,578
- 1
- 30
- 63
4
votes
1 answer
Vue.js error: Named slots must use '' on a custom element
I am trying to pass information through slots and I keep getting an error,
'Named slots must use '' on a custom element.'
See below for my code.
…
Home
Jordan Williams
- 181
- 2
- 10
4
votes
1 answer
Vue.JS - Avoid re-rendering of slots when parent re-renders
I'm struggling on Vue.JS with a component that has as children/slots some "complex" components with canvas data (e.g. Maps).
I want to avoid that when the parent component re-renders, their inner slots re-render. Because of how this components work…
c4b4d4
- 964
- 12
- 32
4
votes
0 answers
How to pass form input elements via scoped slots to child component
How do I access the data entered in my input elements, which are passed through via a slot, to my child component that opens up a modal with the form elements inside of it?
I've been reading the vue docs about scoped slots but honestly, I just can't…
Dennis
- 3,044
- 2
- 33
- 52
3
votes
2 answers
can not loop through $slots object in Vue 3 to pass all slots from parent to child
I can not loop through the $slots object in Vue 3 to pass all slots from parent to child, the $slots object seems empty in the child component.
How can I loop through the $slots object to pass all parent slots to the child component?
I get this…
Fariborz Korevli
- 439
- 5
- 16
3
votes
1 answer
How do I use slots from a Vue2 webcomponent in Vue3?
The component I am trying to use is written in Vue2 and is installed through NPM as a webcomponent. My new project is created in Vue3.
I'm trying to use a components slots, but it's not working.
When I try the following I get no errors, but nothing…
Amadeus Hein
- 706
- 1
- 4
- 12
3
votes
2 answers
Vue: Access Vue component method inside rendered named slot
How can I access the functions of a Vue Component that is rendered inside a named slot of my component?
I have the following structure:
ParentComponent.vue
...
Klausette
- 362
- 1
- 3
- 14
2
votes
1 answer