12

suppose I want to have a data provider element for my user, like 

<user-data-provider user-data="{{data}}"></user-data-provider>

which sends an ajax request and gets the logged in user.

Suppose I want to access my user data in different pages, and I add this tag to wherever I need, but the problem is, every time the browser sees this tag, makes an ajax again and I have to wait until data is fetched!

I know I can make a variable in my main page and pass it along child pages, but that seems like overkill to me !

how can I persist user data across different pages and part of my app?

thank you in advance

Bhaskara Arani
  • 1,556
  • 1
  • 26
  • 44
Developerium
  • 7,155
  • 5
  • 36
  • 56

2 Answers2

4

There are different ways to do this.

  1. You can use use a monostate pattern
  2. You can have one instance of your user-data-provider element in your root element or index.html and use iron-signals to transmit the data to all other elements that want to consume it
  3. You can use iron-meta to have global state
  4. Use an external state management framework (i.e. redux). There is a polymer wrapper for it: polymer-redux

I would recommend using an external state mangement framework such as redux.

Some of the solutions are shown here:

Polymer 1.0 Global Variables

Community
  • 1
  • 1
Ümit
  • 17,379
  • 7
  • 55
  • 74
  • Using redux for this little problem ?! it's like to call the genie for a couple of tea! – S. Ali Mihandoost Sep 11 '16 at 03:50
  • I think its better to use iron-meta for user detail and iron-signal for user state change event – S. Ali Mihandoost Sep 11 '16 at 03:51
  • the bigger the application gets, the more useful an external state management tool such as redux becomes. This way you keep your elements as simple and thus testable as possible. – Ümit Sep 11 '16 at 08:03
0

I used pouchdb for my data store, and used polymer's predefined elements to work with it

now every time that I need data, I just use that component

Developerium
  • 7,155
  • 5
  • 36
  • 56