Sending 'props' to a 'stacked page'

Hi all and @nolimits4web,

Is it possible to send some data via options.props in router.navigate() to a stacked page? I am aware that I can send the data via the URL, but I prefer to hide the data and now show it. Here is the code:

app.views.main.router.navigate('/verify/', {
  props: {

But when I try to receive it as app.view.main.router.currentRoute.props, it is not defined. Any help would be appreciated.

You can use the store for this, if you need help with it let me know. I was trying to do something like that myself, I ended up using the store since you are more freely to do anything you want in the long run.

Thank you @Travis_Antonio for your suggestion. In this specific use case, a store seems an overkill, as I just want to pass some data to a route; there is exactly one place that I need this, but I will use that in my next projects.

For the time being, I modified my navigate wrapper as:

// Navigate to given page
export const navigate = (url, options) => {
  setTimeout(() => {
    if (options && options.props) {
      const route = app.views.main.router.findMatchingRoute(url); // Undocumented; found by checking router.navigate() source code
      if (route) {
        route.route.props = options.props;
    app.views.main.router.navigate(url, options);
  }, 0);

Maybe you or @nolimits4web can tell me your opinion about this. I know findMatchingRoute() is undocumented, but this did exactly what I expected.

I am not aware of the “props” property. I always use “context”, could you try this as well?

Isn’t context for components only? Does it work for normal routes as well? If so, can you please give me an example?

You can try doing it like this, (if you need further help I have discord, my discord is: vennetto#1441 )

            name: 'ordersclient_m', # [ where this is the route you want to go to ]
            props:{scid: value}, #[ the Object you want to send]

Great! And how do you get that scid: value then?

Here is a live example: funny-thompson-l2v5d - CodeSandbox

Thank you Travis for your example. I was wondering if this is possible without using a component, i.e. a simple static route. Anyway, thanks again!

Can you do show us a live example as to what you mean with simple static route or at least a piece of code of it.

Something like this:

  routes: [
      path: '/main/',
      pageName: 'main',
      on: {
        pageInit: () => {

In index.html we have:

      <div class="page stacked" data-name="main">
        <div class="page-content">

I think you should use componentUrl for this case scenario because otherwise you would have to complicate things a little from my point of view, maybe if someone has a better solution, however, the one I see is to use a component in order to pass props and use them.

Very helpful, thanks guys for this!