A guide to advanced use of reusables

Hi I’m merging my app to a native app and I used a lot of reusable element. I know we can’t use the action go to page even if it’s the current page when using a native app, so I’m merging the parameters to statement but I would like to know more from the community on how I can mix my statement knowledge and reusable elements. Any other points of view is appreciated !

fascinating read and well articulated in 1 place. Sometimes, i can be running around many youtubes and guides

1 Like

Great read… Very Informative!

How about using draggable elements from one reuseable into a drop area of another?

Thanks @petter for this post. I think it’s still relevant 3+ years later. I’ve enjoyed your books too btw. :slight_smile:

A quick question if you (or anyone else) might have a thought on this:

Prior to making the change to FULL reusables, I had a multipage app where each page needed to connect to a single reusable element… the header. In order to have an action on a page trigger an action on the reusable header, I made frequent use of the “do when true” action on the header. On any page, I set the state of the reusable header from that page, and then the “Do when true” ran on the RE header to trigger an action. Pretty simple, and it works great.

Recently from I made the switch to a single page architecture, and went all in on reusables. As you point out, dev-wise this is far easier, but the challenge of working across reusables is definitely more tricky. I now have numerous REs on a page, and as before an action within one of these REs needs to trigger an action in the RE header.

Here’s the question/idea I had: Rather than using a plugin, would it work to create a single global reusable element that had no visual elements in it, but only contains a bunch of states you wish to set (let’s call this element “DT EL - Global States”). And then nest DT EL - Global States within each other RE. Then whenever you want to set the state of something across your app, you set it on DT EL - Global States (from within any RE where DT EL - Global States is nested). If RE1 and RE2 both have DT EL - Global States as a nested RE, my thinking is this should enable two-way communication between RE1 and RE2 because both sides would be able to set and clear the custom states?

I’m asking because logically this seems like it should work, and yet, I’m not getting it to (sigh). It seems like it’s conceptually similar to Env Variable, but perhaps easier because it’s native bubble.

Thanks in advance if you were tracking on the above and have a minute to point me in the right direction :sunglasses:

Hi @trevor.goss

From what I understand in your description, you are thinking of placing this reusable element across your app and use its custom state to trigger different things. Each reusable element is considered in isolation by Bubble, which means that two instances of the same reusable element could hold two different values (or no value) in their custom states.

The logic of placing workflows, popups and other stuff in an invisible RE is completely sound though – as long as you keep in mind that they are treated as individual instances.

Let me know if I misunderstood you here!

2 Likes

Thanks @petter !

Ah, that’s why it’s not working then. I’ll admit it does seems weird that two instances of the same reusable on a page (both visible) could hold different values at a time, but what you articulated makes sense as to why my workflow wasn’t producing the desired results.

Given that limitation, I’m assuming this is where the env variable plugin @gaurav developed comes in (i.e. it is global and that makes its states available to RE1 and RE2, etc)?

You can now use ‘go to page’ = current page in workflows to make things a bit easier with reusables, rather than hard coding the page and reloading.

There is also now a dynamic page option.

There are some drawbacks you can read in the thread below but i thought it worth adding to this thread.

hi @petter

I have bought your new edition for performance. But I already bought the initial one. However, it seems I managed to do it without being registered in gumroad. I can’t even find in my inbox any confirmation emails.
Is there a way to get reimbursed?
(I also bought the ultimate guide for security btw)

Hi @nassmim972 ,

Could you DM me your email address, and I’ll look into?

great guide, thanks!!

For those reading this guide in 2024 and later (and if you scroll this far down…); after Bubble added custom parameters to reusable elements, the sharing of data between them has become quite a bit easier.

Many of the points in this guide would probably be over-engineering at this point, so I recommend people get to know how the reusable element parameters work, and use them if they can solve the problem in an easier way.

3 Likes

I know this is pretty late, but for anyone who might need it, you can check out this plugin: Browser Storage X Plugin | Bubble.
Demo: Browser Storage - Plugin Demo

1 Like