How to use vl-interaction-modify with reactive features?

[fnoop]

If I create a source vector layer with features created in a template, like:

vl-layer-vector
        vl-source-vector(ref="waypointLayer" ident="waypoint-draw-target")
          vl-feature(v-if="missionActive[activeApi]" v-for="(waypoint, index) in missionActive[activeApi].mission" :id="'w_' + index" :key="'w_' + index")

And then make the features draggable like:
vl-interaction-modify(source="waypoint-draw-target")

Then when you drag a feature, it snaps back to it's original position shortly, presumably because the source value to the feature is reactive?

So how to make existing features modifiable? If I create an empty source layer using an empty features container:

      vl-layer-vector
        vl-source-vector(ref="waypointLayer" ident="waypoint-draw-target" :features.sync="waypointFeatures")

Then how to populate the features array with feature components programatically?

[fnoop]

This works in a watcher, but it's a bit crude:

        let newFeatures = mission
          .filter(waypoint => waypoint.latitude && waypoint.longitude)
          .map(waypoint => ({
            geometry: {
              type: 'Point',
              coordinates: [waypoint.longitude, waypoint.latitude]
            },
            type: 'Feature'
          }))
        this.$refs.waypointLayer.addFeatures(newFeatures)

[ghettovoice]

There is known bug #121, that can be related with your problem.
I plan to release next patch in the near future that should resolve reactive problems with features prop
in all components

[stale]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.