Sencha Touch - การพึ่งพา

มีบางวิธีที่กำหนดไว้ใน Sencha Touch เพื่อประกาศการอ้างอิงหนึ่งในแอปพลิเคชันและอีกวิธีหนึ่งในคลาส

มาดูวิธีต่างๆในการกำหนดการอ้างอิงกัน

การพึ่งพาระดับแอปพลิเคชัน

ที่นี่เราประกาศการอ้างอิงทั้งหมดเมื่อเราสร้าง Ext.application

Ext.application({
   name: 'MyApp',
   views: ['StudentsView'],
   models: ['StudentsModel'],
   controllers: ['StudentsController'],
   stores: ['StudentsStore'],
   profiles: ['Phone', 'Tablet']
});

ตอนนี้เมื่อแอปพลิเคชันโหลดขึ้นการอ้างอิงทั้งหมดจะถูกโหลดพร้อมกัน เส้นทางของไฟล์อื่น ๆ จะเป็น -

  • MyApp.views.StudentsView
  • MyApp.models.StudentsModel
  • MyApp.stores.StudentsStore เป็นต้น

วิธีการประกาศข้างต้นไม่เพียง แต่โหลดไฟล์เท่านั้น แต่ยังตัดสินว่าโปรไฟล์ใดควรใช้งานได้อีกด้วย หลังจากโหลดคอนโทรลเลอร์แล้วตรวจสอบให้แน่ใจว่าได้สร้างอินสแตนซ์แล้ว เมื่อโหลดร้านค้าแล้วมันจะสร้างอินสแตนซ์ของพวกเขาและระบุหนึ่ง ID หากยังไม่ได้รับ

การพึ่งพาเฉพาะโปรไฟล์

เมื่อเราใช้โปรไฟล์ในแอปพลิเคชันอาจมีความเป็นไปได้ที่ฟังก์ชันบางอย่างจำเป็นสำหรับบางโปรไฟล์เท่านั้น

การอ้างอิงเฉพาะโปรไฟล์ถูกประกาศในโปรไฟล์เองแทนที่จะเป็นการประกาศระดับแอปพลิเคชัน

Ext.define('MyApp.profile.Tablet', {
   extend: 'Ext.app.Profile', config: {
      views: ['StudentView'], controllers: ['StudentController'], models: ['StudentModel']
   }
});

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

การอ้างอิงที่ซ้อนกัน

เมื่อเรามีแอปพลิเคชั่นที่ใหญ่ขึ้นเรามีตัวควบคุมโมเดลมุมมองและร้านค้าหลายตัว

การรักษาความเป็นโมดูลาร์ไว้ในแอปพลิเคชันขนาดใหญ่เป็นเรื่องดี ด้วยเหตุนี้เราสามารถกำหนดโฟลเดอร์ย่อยและในขณะที่ประกาศการอ้างอิงเราสามารถใช้ชื่อโฟลเดอร์ย่อยเพื่อประกาศได้

Ext.application({
   name: 'MyApp',
   controllers: ['Controller', 'nested.NewController'],
   views: ['class.Cview', 'SView']
});

ในกรณีข้างต้นไฟล์ต่อไปนี้จะถูกโหลด -

  • MyApp.controllers.Controller
  • MyApp.controllers.nested.NewController
  • MyApp.Views.Sview
  • MyApp.Views.class.Cview

การพึ่งพาภายนอก

เราสามารถระบุการอ้างอิงภายนอกแอปพลิเคชันโดยตั้งชื่อคลาสที่มีคุณสมบัติครบถ้วนเป็น -

Ext.Loader.setPath({
   'Class': 'Class'
});

Ext.application({
   views: ['Class.view.LoginForm', 'Welcome'],
   controllers: ['Class.controller.Sessions', 'Main'],
   models: ['Class.model.User']
});

ในกรณีข้างต้นไฟล์ต่อไปนี้จะถูกโหลด -

  • Class/view/LoginForm.js
  • Class/controller/Sessions.js
  • Class/model/User.js
  • app/view/Welcome.js
  • app/controller/Main.js