Emberjs leaflet - object as parameter


#1

Hello, I am new to emberjs and am creating an emberjs-leaflet and emberjs-leaflet-draw application as frontend to an api.

I have this code to init the map in the template

{{#leaflet-map lat=lat lng=lng zoom=zoom}} {{tile-layer url=“http://{s}.basemaps.cartocdn.com/light_all/{z}/{x}/{y}.png”}} {{draw-control draw=draw}} {{/leaflet-map}}

and i want to pass to draw an object of options so i use this controller

import Controller from ‘@ember/controller’;

export default Controller.extend({ lat: 45.519743, lng: -122.680522, zoom: 10, draw: { polyline: false, circle: false, rectangle: false, marker: false }, });

but i get an error

error Only string, number, symbol, boolean, null, undefined, and function are allowed as default properties ember/avoid-leaking-state-in-ember-objects

How can i pass such options or even more compicated ones?

Sadly the documentation and demos links for https://www.npmjs.com/package/ember-leaflet-draw do not work.


#2

The error is just an ESLint error telling you to avoid leaking state when creating objects. In this case you’re creating a controller and the ‘draw’ property is being initialized as an object. Technically this will still work but it can leak state between objects (see the eslint guide and also the dockyard article it links). To fix it you can follow the example in the guide, which would yield something like this:

import Controller from ‘@ember/controller’;

export default Controller.extend({
  lat: 45.519743,
  lng: -122.680522,
  zoom: 10,

  init() {
    this._super(...arguments);
    this.draw = {
      polyline: false,
      circle: false,
      rectangle: false,
      marker: false
    }; 
  }
});