Last active
April 16, 2021 17:24
-
-
Save NullVoxPopuli/1eaf11293017b1dd6ee76395da699a12 to your computer and use it in GitHub Desktop.
Reproduction of child nav with queryparams
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Controller from '@ember/controller'; | |
import { tracked } from '@glimmer/tracking'; | |
import { inject as service } from '@ember/service'; | |
import { action } from '@ember/object'; | |
export default class Application extends Controller { | |
@service router; | |
queryParams = ['filter', 'sort']; | |
@tracked filter = ''; | |
@tracked sort = ''; | |
/** | |
* This _kinda_ makes sense, because this sets the query params on transition | |
* and setting invalidates tracked properties. | |
* | |
* here, it does not matter what the value of the query params are, the | |
* model hook _always_ re-runs (it shouldn't) | |
* | |
* maybe if the qp properties had some value-based-caching / memoization to prevent | |
* unneeded invalidation, that would solve the problem? | |
*/ | |
@action | |
reproductionWithHrefs(e) { | |
e.preventDefault(); | |
if (this.router.isActive('child')) { | |
return this.router.transitionTo(`/?filter=${this.filter}&sort=${this.sort}`); | |
} | |
this.router.transitionTo(`/child?filter=${this.filter}&sort=${this.sort}`); | |
} | |
/** | |
* Even when the query params are omitted (falling back to sticky behavior), | |
* the model hook still re-runs (it shouldn't) | |
*/ | |
@action | |
reproductionWithDotNotation(e) { | |
e.preventDefault(); | |
if (this.router.isActive('child')) { | |
return this.router.transitionTo('application'); | |
} | |
this.router.transitionTo('child'); | |
} | |
@action | |
worksButDeprecated(e) { | |
e.preventDefault(); | |
if (this.router.isActive('child')) { | |
return this.transitionToRoute('application'); | |
} | |
this.transitionToRoute('child'); | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import EmberRouter from '@ember/routing/router'; | |
import config from './config/environment'; | |
const Router = EmberRouter.extend({ | |
location: 'none', | |
rootURL: config.rootURL | |
}); | |
Router.map(function() { | |
this.route('child'); | |
}); | |
export default Router; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import Route from '@ember/routing/route'; | |
import { tracked } from '@glimmer/tracking'; | |
class InvocationTracker { | |
@tracked count = 0; | |
} | |
export default class Application extends Route { | |
tracker = new InvocationTracker(); | |
queryParams = { | |
filter: { | |
refreshModel: true, | |
}, | |
sort: { | |
refreshModel: true, | |
}, | |
}; | |
async model() { | |
this.tracker.count++; | |
return this.tracker; | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"version": "0.17.1", | |
"EmberENV": { | |
"FEATURES": {}, | |
"_TEMPLATE_ONLY_GLIMMER_COMPONENTS": false, | |
"_APPLICATION_TEMPLATE_WRAPPER": true, | |
"_JQUERY_INTEGRATION": true | |
}, | |
"options": { | |
"use_pods": false, | |
"enable-testing": false | |
}, | |
"dependencies": { | |
"jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.js", | |
"ember": "3.18.1", | |
"ember-template-compiler": "3.18.1", | |
"ember-testing": "3.18.1" | |
}, | |
"addons": { | |
"@glimmer/component": "1.0.0" | |
} | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment