ExtJS7: Routes with query parameters not matching

Question

I have implemented routes to match query parameters in ExtJS7 with following routes code

        ':node:params': {
          before: 'isLoggedIn',
          action: 'onAction',
          conditions: {
            ':params': '(^\\?[%a-zA-Z0-9\\-\\_\\s,&=]+)'
          }
        }

I have also tried with following code

        ':node?:params': {
          before: 'isLoggedIn',
          action: 'onAction'
        }

in both cases, routes with query parameters are not being matched to above routes but invokes unmatchedroute action

Answer 1

You can't match routes to query parameters. The Router matches based on the window.location.hash - the part of the URL after the #. Query parameters are part of the window.location.querystring; there is no overlap.

You can parameterise routes - but not with query parameters.

Answer 2

I know I'm 3 years late here, but it is possible to use "?" as your 'params' identifier for the extjs router, so you can have the router match #action/123 and #action/123?a=b, you just need the right regex for your conditions. I use something similar to this:

'action:params': {
      before: 'isLoggedIn',
      action: 'onAction',
      conditions: {
        ':params': '(?:(?:\\\??){1}([%=&a-zA-Z0-9\\-\\_\\s,&=]+))?'
      }
}

Wrapping the input with a non-capturing group with the "?" quantifier at the end allows navigation to #action with no following query. You also need to escape both the backslash and the "?" in the inner non-capturing group as "\?" so the regex is correctly parsed as "?".

The only potentially odd interaction I've found with this is that if the router receives just "#my-view?" with no following query string, the onAction method is passed "?" for 'params' but that's easy enough to account for.