Ember, change current url and LinkTo targets without reloading data

问题

How to change an url and the LinkTo components without reloading data?

Figure an app where a user can change the name of his project. The current url contains the project name, so it must be updated. Nothing excepts the url and the links must be modified (no data reload)

Consider this main route:

this.route('routeName', { path: '/:project_name/:param2/:param3' }, function () {
  ...many sub routes
});

The replaceURL method allow to change the url:

this.router.location.replaceURL(urlWithNewProjectName)

Example of LinkTo usage (no model is specified, default values are used):

{{#LinkTo 'routeName'}}link{{/LinkTo}}

For example the following fails:

// this code in the router has no effect on LinkTo in templates.
const params = this.paramsFor(this.routeName);
params.project_name = "newName";

LinkTo components continue to target old urls. How to change a dynamic segment default value for a route?

回答1:

You need to pass the dynamic segments to the LinkTo component in the template. When those props change, the link will update. See the guides for more info starting here: https://guides.emberjs.com/release/templates/links/#toc_example-for-multiple-segments

来源：https://stackoverflow.com/questions/58328649/ember-change-current-url-and-linkto-targets-without-reloading-data