What is the purpose of @reflectable in Polymer Dart 1.0.0?

3
votes

I already know some of the places I have to use @reflectable in like this 

@property String get name Band =>_nameBand;
@reflectable void set nameBand(val) {
   _nameBand = val;
   notifyPath('nameBand', _nameBand;
}

And for events triggered by, say, clicking an element. 

<paper-button on-click="clicked"></paper-button>

Inside the elements class definition where you define the event handler method that you want to be called on the on-click event. 

... 
@reflectable
void clicked([_, __]) {
   ... 
}

And without the @reflectable annotation, Polymer won't be able to find either the setter or the method you want to be used whenever the paper-button is clicked. Why is @reflectable needed, as in, what is its purpose?

I realise I seem to be answering my own question, but I would love some clarification. Thanks.

2
dartdart-polymer

2 Answers

5
votes

without the @reflectable annotation the tree shaker will throw away all the meta data needed by polymer. Polymer uses https://pub.dartlang.org/packages/reflectable to allow it to use a limited amount of reflection without bloating the code size too much.

6
votes

In addition to @Anders' answer...
you need to annotate every method with @reflectable that you want expose to Polymer to be used as event handler (on-tap="clickHandler") or for bindings with funciton calls like attribute-name="{{computeValue(someName)}}". You also need to annotate every field in a model class you want to bind to

Person extends JsProxy {
  @reflectable String firstName;
  @reflectable String lastName;
}