อะไรคือความแตกต่างระหว่างเส้นทางและทรัพยากรใน New Router API

114

ฉันพยายามเข้าใจความแตกต่างระหว่าง a RouteและResource. วิธีที่ฉันเข้าใจResourceช่วยในการกำหนดเส้นทางย่อยของRouteวัตถุไปยังRouteวัตถุอื่น แต่มันไม่ชัดเจนเมื่อฉันคิดถึงการแมปชื่อเริ่มต้นที่เกิดขึ้นกับเส้นทางเช่นกัน

ember.js ember-router

— thecodejack
แหล่งที่มา

101

โปรดทราบว่าตั้งแต่ 1.11.0 เป็นต้นไปthis.routeจะใช้แทนthis.resourceไฟล์. ที่มา: http://guides.emberjs.com/v1.11.0/routing/defining-your-routes/ *

ดูโพสต์นี้สำหรับคำอธิบายโดยละเอียด

นี่คือสรุปคร่าวๆของโพสต์นี้ (ฉันได้แก้ไขเล็กน้อย):

นับตั้งแต่มีการเปลี่ยนแปลงทรัพยากรและกำหนดเส้นทางผู้คนจำนวนมากสับสนเกี่ยวกับความหมายของทั้งสองและผลกระทบต่อการตั้งชื่ออย่างไร นี่คือความแตกต่าง:

ทรัพยากร - สิ่งของ (แบบจำลอง)

เส้นทาง - สิ่งที่เกี่ยวข้องกับสิ่งนั้น

ดังนั้นนี่หมายความว่าเราเตอร์ที่ใช้เส้นทางและทรัพยากรอาจมีลักษณะดังนี้:

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

ซึ่งจะส่งผลให้มีการสร้าง / ใช้เส้นทางต่อไปนี้:

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

ดังที่เราเห็นจากตัวอย่างนี้ทรัพยากรมีผลต่อการตั้งชื่อตัวควบคุมเส้นทางและมุมมองที่ใช้ / สร้างขึ้น (เส้นทาง "ใหม่" จะถือว่าเป็นทรัพยากรรองของ "โพสต์") อ้างอิงจากแหล่งที่มาเดิม (ฉันแก้ไขแล้วเพราะมันน่ารำคาญเนื่องจาก Patrick M ชี้ให้เห็นอย่างถูกต้องในความคิดเห็น):

ซึ่งหมายความว่าเมื่อใดก็ตามที่คุณสร้างทรัพยากรมันจะสร้างเนมสเปซใหม่ เนมสเปซนั้นตั้งชื่อตามทรัพยากรและเส้นทางลูกทั้งหมดจะถูกแทรกลงในนั้น

อัปเดต: ตัวอย่างที่ซับซ้อนมากขึ้นพร้อมทรัพยากรที่ซ้อนกัน

พิจารณาตัวอย่างที่ซับซ้อนยิ่งขึ้นต่อไปนี้ด้วยทรัพยากรที่ซ้อนกันหลายรายการ:

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

ในกรณีนี้ทรัพยากรcommentsจะสร้างเนมสเปซใหม่ ซึ่งหมายความว่าเส้นทางที่ได้ในกรณีนี้จะเป็นดังต่อไปนี้ ดังที่คุณเห็นเส้นทางคอนโทรลเลอร์และมุมมองสำหรับทรัพยากรความคิดเห็นไม่ได้ขึ้นต้นด้วยชื่อของเส้นทางหลัก นั่นหมายถึงการซ้อนทรัพยากรภายในทรัพยากรอื่นจะรีเซ็ตเนมสเปซ (= สร้างเนมสเปซใหม่)

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

ลักษณะการทำงานนี้จะมีการอธิบายในEmber เอกสาร

— mavilein
แหล่งที่มา

สิ่งนี้ควรชัดเจนกว่าในคู่มือ Ember ตอนแรกฉันรู้สึกสับสนกับแนวคิดนี้อย่างแน่นอน

— Gabriel G. Roy

สรุปยอดเยี่ยมของการโพสต์ที่ยอดเยี่ยม That namespace will have an " which [...]แต่คำพูดสุดท้ายที่คุณรวมถึงการไม่ให้ความรู้สึก: อะไร"หมายถึง? เป็นเพียงตัวยึดสำหรับ Route | คอนโทรลเลอร์ | ดู?

— Patrick M

เฮ้แพทริคขอบคุณที่ชี้ให้เห็น ฉันไม่สามารถหาเบาะแสได้อีกต่อไป ดังนั้นฉันจึงเพิ่มตัวอย่างที่ซับซ้อนมากขึ้นด้วยทรัพยากรที่ซ้อนกัน ฉันคิดว่าการอ้างอิงนี้อ้างถึงสถานการณ์นี้

— mavilein

นั่นชัดเจนกว่ามาก ขอบคุณสำหรับตัวอย่างพิเศษ mavilein

— Patrick M

คุณช่วยอธิบายให้ละเอียดได้ไหมว่าอะไรคือความแตกต่าง (ถ้ามี) ระหว่างตัวอย่างของคุณกับสิ่งนี้:

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