Qual é a diferença entre uma rota e um recurso na Nova API do roteador?

114

Estou tentando entender a diferença entre a Routee a Resource. A maneira como eu entendo Resourceajuda a definir caminhos secundários de um Routeobjeto para outro Routeobjeto. Mas não está claro quando penso no mapeamento de nomes padrão acontecendo para caminhos também.

theecodejack
fonte

Respostas:

101

Observe que a partir de 1.11.0 em diante, this.routeé usado apenas em vez de this.resource. Fonte: http://guides.emberjs.com/v1.11.0/routing/defining-your-routes/ *

Dê uma olhada neste post para uma explicação detalhada.

Este é um resumo aproximado desta postagem (eu modifiquei um pouco):

Desde a mudança para recurso e rota, muitas pessoas estão confusas sobre o significado dos dois e como eles afetam a nomenclatura. Aqui está a diferença:

  • recurso - uma coisa (um modelo)
  • rota - algo a ver com a coisa

Portanto, isso significa que um roteador usando uma rota e um recurso pode ter a seguinte aparência:

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

Isso resultaria na criação / utilização das seguintes rotas:

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

Como podemos ver neste exemplo, o recurso afeta a nomenclatura dos Controladores, Rotas e Visualizações que estão sendo usados ​​/ criados (A "nova" rota é tratada como subordinada ao recurso "postagens"). Cite da fonte original (eu modifiquei, porque era irritante como Patrick M corretamente apontou nos comentários):

Isso significa que sempre que você criar um recurso, ele criará um novo namespace. Esse namespace é nomeado após o recurso e todas as rotas secundárias serão inseridas nele.

Atualização: exemplo mais complexo com recursos aninhados

Considere o seguinte exemplo mais complexo com vários recursos aninhados:

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" });
});

Nesse caso, o recurso commentscria um novo namespace. Isso significa que as rotas resultantes, neste caso, serão as seguintes. Como você pode ver, Route, Controller e View para o recurso de comentários não são prefixados com o nome da rota pai. Isso significa que aninhar um recurso dentro de outro recurso redefine o namespace (= cria um novo namespace).

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

Esse comportamento também é explicado no Ember Docs .

Mavilein
fonte