Version

3.0.11

Reproduction link

https://codepen.io/manusis/pen/mdRKyJv

Steps to reproduce

Use "" as template for the component. It replaces the slot tag with the inline template but does not resolve props used in the inline template.

What is expected?

The props used in the default slot template for component should render

What is actually happening?

The prop is rendering when using component template field but not rendering when used in slot template.

1. Do not modify props because it is read-only. If you use the dev build of Vue, you will get a warning. see the One Way Data Flow
2. You have completely misunderstood the meaning of slots, I recommend you to read the documentation first:

• Component basics
• Component slots

Non-scoped slot rendering ocurrs in parent component, the result is determined in the context of parent. Not by the component which receives the slot.

Thanks @HcySunYang @Sociosarbis and sorry for the naive question. We come from AngularJS background and are new to Vue.

Our use case is very simple, we want to use the component inner html if available as a template, otherwise use the template provided in component options. Tried multiple things but nothing worked. Slot looked closest to transclude.

Can you guide me in the right direction? In our case, most components do not have a fixed template but are used only provide props and methods to the inner html template but some components do have a default template.

@manusis use the forum or the Discord chat to ask questions!