Я создал небольшое приложение sudoku с помощью Javascript. Теперь я пытаюсь преобразовать этот код javascript в код extjs (4.1.1a). Я просмотрел docs, чтобы понять архитектуру MVC, но для меня это было не так подробно, как новичок.
Может кто-нибудь объяснить архитектуру MVC Extjs на основе моего приложения Sudoku?
Дизайн моего кода приложения sudoku выглядит следующим образом:
Описание приведенной выше конструкции выглядит следующим образом:
-
container (blue) --> parent panel (grey) --> child panel (red)
-
"Панели родителей" - девять, и каждая "родительская панель" имеет девять "дочерних панелей".
-
HTML-элементы "родительских панелей" и "дочерние панели" генерируются динамически, используя для циклов.
-
Я написал такие события, как
KeyDown
события иclick
события на "дочерних панелях". -
Я также написал некоторые функции, такие как
checkGroup() → проверяет в каждой "родительской панели", есть ли дублирующие номера checkVertical() → проверяет в каждой вертикальной строке "контейнер" для повторяющихся номеров checkHorizontal() → проверяет в каждой горизонтальной строке "контейнер" для повторяющихся номеров
EDIT: (незавершенный и неструктурированный код)
app.js (основной файл js)
Ext.application({
name: 'Game',
appFolder: 'app',
controllers: ['Sudoku']
});
контроллер (папка "приложение" → папка "контроллер" → Sudoku.js)
//By using 'controller', trying to call 'view' here
Ext.define('Game.controller.Sudoku', {
extend: 'Ext.app.Controller',
init: function () {
console.log("controller init");
},
onLaunch: function () {
console.log("controller onLaunch");
},
views: ['Sudoku']
});
просмотр (папка "приложение" → "просмотр" → Sudoku.js)
Ext.define('Game.view.Sudoku', {
extend: 'Ext.window.Window', //what should I extend here for view?
initComponent: function () {
//my complete sudoku js file here
console.log("hello");
}
});