[Vuejs]-Vue double iterate in v-for

by

1👍

✅

You could use a computed property to prepare the data for leaflet:

computed : {
  links () {
    return this.linkList.map(l => {
       l.latlng = [[l.flat,l.flng], ...l.vertexlist , [l.tlat,l.tlng]]
       return l
    }) 
  }
}

<l-feature-group>
  <l-polyline
    v-for="link in this.links"
    :key="link.linkid"
    :lat-lngs="link.latlngs"
    :color="'green'"
  >
  </l-polyline>
</l-feature-group>

Or in the template: 

<l-polyline
    v-for="l in this.linkList"
    :key="l.linkid"
    :lat-lngs="[[l.flat,l.flng], ...l.vertexlist , [l.tlat,l.tlng]]"
    :color="'green'"
  >
👤ellisdod

Leave a comment