“Scoped slots” is a feature of Vue.js that doesn’t get used as often as it might, probably because it’s quite confusing. Trying to get your head around the interweaving of parent and child scopes is like solving a tough math equation.

A good approach when you can’t understand something easily is to try put it to use in solving a problem. This week I’ve written an article to demonstrate how I used scoped slots to build a reusable list component.

There’s lots of great news this week, too. Firstly, an official style guide for Vue-specific code has been released. There’s also a beta release of vue-test-utils, the official test library for Vue.js. See below for links to these and more.

Scoped slots are a useful feature of Vue that can make components more versatile and reusable. The only problem is they’re hard to understand! In this article, I’ll go through a step-by-step example so you can see how useful scoped slots are.