Full-Stack Vue.js 2 and Laravel 5

Scoped slots
The FeatureList component works but is quite weak. The majority of the content
comes through the slot and so it seems like the parent is doing too much work,
and the child too little. Given that there's repeated code in both declarations of
the component (), it'd be good to delegate this to
the child.
To allow our component template to be more versatile, we can use a scoped slot
instead of a regular slot. Scoped slots allow you to pass a template to the slot
instead of passing a rendered element. When this template is declared in the
parent, it will have access to any props supplied in the child.
For example, a component child with a scoped slot might look like the following:
A parent that uses this component will declare a template element, which will
have a property slot-scope that names an alias object. Any props added to the slot
in the child template are available as properties of the alias object:
Hello from parent {{
props.my-prop }}
This renders as:
Hello from parent
Hello from child
Let's go through the steps of including a scoped slot with our FeatureList
component. The goal is to be able to pass the list items array in as a prop and get
the FeatureList component to iterate them. That way, FeatureList is taking
ownership of any repeated functionality. The parent will then provide a template
to define how each list item should display.
resources/views/app.blade.php: