Live example new
https://codesandbox.io/s/py28wo18qj
$slot variable for scoped slots (will be available for Vue 2.6+)https://codesandbox.io/s/py28wo18qj
CodeSandbox
New scoped slot syntax in Vue - CodeSandbox
New scoped slot syntax in Vue by c01nd01r
VueJS News
Live example new $slot variable for scoped slots (will be available for Vue 2.6+) https://codesandbox.io/s/py28wo18qj
- Support $slot variable in all slots. (The presence of $slot causes the slot to be compiled as a scoped slot).
- All slots, including normal slots, are now exposed on this.$scopedSlots as functions. This means assuming this.$slots.default exists, this.$scopedSlots.default() will return its value. This allows render function users to always use this.$scopedSlot and no longer worry about whether the slot being passed in is scoped or not. This is also consistent with 3.0 where all slots are exposed as functions (but on this.$slots instead).
- No change to slot-scope usage, no introduction of new directive. We want to make syntax changes minimal and leave potential breakage to 3.0.
https://github.com/vuejs/vue/issues/9180#issuecomment-452848580
- All slots, including normal slots, are now exposed on this.$scopedSlots as functions. This means assuming this.$slots.default exists, this.$scopedSlots.default() will return its value. This allows render function users to always use this.$scopedSlot and no longer worry about whether the slot being passed in is scoped or not. This is also consistent with 3.0 where all slots are exposed as functions (but on this.$slots instead).
- No change to slot-scope usage, no introduction of new directive. We want to make syntax changes minimal and leave potential breakage to 3.0.
https://github.com/vuejs/vue/issues/9180#issuecomment-452848580
GitHub
RFC: Simplify scoped slot usage · Issue #9180 · vuejs/vue
This is a follow up of #7740 (comment) Rational Problems with current scoped slot usage: Verbose if using Limited to one element/component is using slot-scope directly o...
New discussion for scoped slots syntax.
Base:
Shorthand syntax:
Share your opinion:
https://github.com/vuejs/vue/issues/9306
Base:
<foo slot-props="{ msg }">
{{ msg }}
</foo>Shorthand syntax:
<foo ()="{ msg }">
{{ msg }}
</foo>Share your opinion:
https://github.com/vuejs/vue/issues/9306
GitHub
RFC: New syntax for scoped slots · Issue #9306 · vuejs/vue
This is an update of #9180 where we attempt to finalize a new syntax proposal for scoped slots (in a backwards compatible way). Rationale When we first introduced scoped slots, it was verbose becau...