Loops in Vue with Jade: each or v-for?

VueJS
1

I am trying to use single file Vue components (without Blaze) with the templates in Jade/Pug using the following packages:

First, I assume that vue-jade uses the meteor-independent pug transpiler and not the meteor-specific pacreach:jade package (merge of the older mquandalle:jade and dalgard:jade packages): I am correct?

Second, I wonder what should I use to loop through a list or the rows of table:

  • jade/pub’s each iterator?
  • Vue’s v-for directive?

Any advice?

2

Using Jade, v-for will be as easy as:

<template lang="jade">
  ul
    li(v-for="name in names") {{name}}
</template>

V-for gives you a nice control over your array, with index etc, so I’d use it instead of Jade’s each.

Also, your code will be easier to read by people who don’t use Jade and easier for you to rewrite to HTML when you want to show it in some tutorial or paste here on the forums to help somebody.