CODEWITHSUNDEEP
polymerpolymer-2.x
Rashomon
Rashomon

Reputation: 6762

Any way to share data between Polymer components?

Currently I have two Polymer components that share a great amount of data. You can see here:

<polymer-component1
      series="{{series}}" 
      stackhelper={{stackhelper}} 
      stack={{stack}}
      controls={{controls}} 
      camera={{camera}} 
      threed={{threed}} 
      scene={{scene}} 
      renderer={{renderer}}>
</polymer-component1>
<polymer-component2 
      stackhelper=[[stackhelper]]
      stack={{stack}} 
      controls={{controls}} 
      camera={{camera}} 
      threed={{threed}} 
      scene={{scene}} 
      renderer={{renderer}}
      guiobjects={{guiobjects}}>
</polymer-component2>

This is working fine right now but whats the best practice about sharing data? Any way to share all the properties between two components?

Upvotes: 3

Views: 645

Answers (2)

Frank R.
Frank R.

Reputation: 1832

It's recommended to share data through data binding, just as what you're doing. You can share any property, not just strings and numbers. e.g. assuming you have an object

JS

data = {
    series: "",
    stackhelper: "",
    stack: "",
    controls: "",
    camera: "",
    threed: "",
    scene: "",
    renderer: "",
}

Your code can be rewritten like this.

HTML

<polymer-component1 data="{{data}}"></polymer-component1>
<polymer-component2 data="{{data}}"></polymer-component2>

Upvotes: 2

Pascal L.
Pascal L.

Reputation: 1259

In Polymer 2 one element can just inherit the properties by extending it.

class MyElementSubclass extends MyElement {...}

Or you create an element with just the properties both need and then both components extend the parent. You can find this here scroll down to Extending an existing element

Upvotes: 1

Related Questions