Qual è la differenza tra un percorso e una risorsa nella nuova API del router?


114

Sto cercando di capire la differenza tra a Routee a Resource. Il modo in cui capisco Resourceaiuta a impostare i sottopercorsi di un Routeoggetto su un altro Routeoggetto. Ma non è chiaro quando penso alla mappatura dei nomi predefinita che si verifica anche per i percorsi.

Risposte:


101

Si noti che dalla 1.11.0 in poi, this.routeviene utilizzato solo al posto di this.resource. Fonte: http://guides.emberjs.com/v1.11.0/routing/defining-your-routes/ *

Dai un'occhiata a questo post per una spiegazione dettagliata.

Questo è un sommario approssimativo di questo post (ho modificato un po '):

Da quando sono passati alla risorsa e al percorso, molte persone sono confuse sul significato dei due e su come influenzano la denominazione. Ecco la differenza:

  • risorsa - una cosa (un modello)
  • percorso - qualcosa a che fare con la cosa

Quindi questo significa che un router che utilizza un percorso e una risorsa potrebbe essere simile a questo:

App.Router.map(function() {
  this.resource("posts", { path: "/" }, function() {
    this.route("new", { path: "/new" });
  });
  this.route("another", { path: "/another" });
});

Ciò comporterebbe la creazione / l'utilizzo delle seguenti rotte:

  • PostsRoute, PostsController, PostsView
  • PostsIndexRoute, PostsIndexController, PostsIndexView
  • PostsNewRoute, PostsNewController, PostsNewView
  • AnotherRoute, AnotherController, AnotherView

Come si vede da questo esempio, le risorse influenzano la denominazione dei controller, delle rotte e delle viste utilizzate / create (la "nuova" rotta è trattata come subordinata alla risorsa "post"). Cito dalla fonte originale (l'ho modificata, perché irritante come ha correttamente sottolineato Patrick M nei commenti):

Ciò significa che ogni volta che crei una risorsa, verrà creato un nuovo spazio dei nomi. Quello spazio dei nomi prende il nome dalla risorsa e tutte le route figlio verranno inserite in esso.

Aggiornamento: esempio più complesso con risorse annidate

Considera il seguente esempio più complesso con più risorse nidificate:

App.Router.map(function() {
  this.resource("posts", { path: "/" }, function() {
    this.route("new", { path: "/new" });
    this.resource("comments", { path: "/comments" }, function() {
      this.route("new", { path: "/new" });
    });
  });
  this.route("another", { path: "/another" });
});

In questo caso la risorsa commentscrea uno spazio dei nomi nuovo di zecca. Ciò significa che le rotte risultanti in questo caso saranno le seguenti. Come puoi vedere la rotta, il controller e la vista per la risorsa commenti non hanno il prefisso del nome della rotta principale. Ciò significa che annidare una risorsa all'interno di un'altra risorsa reimposta lo spazio dei nomi (= crea un nuovo spazio dei nomi).

  • PostsRoute, PostsController, PostsView
  • PostsIndexRoute, PostsIndexController, PostsIndexView
  • PostsNewRoute, PostsNewController, PostsNewView
  • CommentsRoute, CommentsController, CommentsView
  • CommentsNewRoute, CommentsNewController, CommentsNewView
  • AnotherRoute, AnotherController, AnotherView

Questo comportamento è spiegato anche nei documenti Ember .


4
Questo dovrebbe essere più chiaro nelle guide Ember. All'inizio ero certamente confuso da questo concetto.
Gabriel G. Roy

Ottima sintesi di un ottimo post. Ma l'ultima citazione di includere non ha senso: That namespace will have an " which [...]. Cosa "significa? È solo un segnaposto per Route | Controller | Visualizza?
Patrick M

Ehi Patrick, grazie per averlo fatto notare. Non riuscivo più a ricavarne un indizio. Pertanto ho aggiunto un esempio più complesso con risorse nidificate. Penso che questa citazione si riferisse a questo scenario.
mavilein

Questo è molto più chiaro. Grazie per l'esempio in più, mavilein.
Patrick M

Puoi approfondire qual è la differenza (se esiste) tra il tuo esempio e questo:App.Router.map(function() { this.route("posts", { path: "/" }, function() { this.route("new"); this.route("comments"}, function() { this.route("new"); }); }); this.route("another", { path: "/another" }); });
Timo
Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.