Marionette JS使用requirejs从控制器访问应用程序 [英] Marionette js access to app from controller with requirejs
本文介绍了Marionette JS使用requirejs从控制器访问应用程序的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我想从主控制器访问我的主应用程序实例 呈现新的视图.我想做的事是在controller/main.js代码中注释的,因为我知道这是require js中的circ依赖关系,但我不知道如何解决此问题
I want to get access to my main app instance from main controller to render new View. What i want to do is commented in controller/main.js code, as i understand this is circ dependency in require js, but i don't understand how to fix this
file structure
- controllers/main.js
- models/
- templates/
- views/
- app.js
- main.js
- router.js
main.js
require.config({...})
require(['app'], function(app) {
app.initialize().start();
});
app.js
define(['jquery', 'underscore', 'backbone', 'marionette', 'router','controllers/main'],
function($, _, Backbone, Mn, Router, MainController) {
let app = null;
const App = Mn.Application.extend({
region: '#app',
initialize(options) {
this.router = options.router;
},
onBeforeStart() {
console.log('before start');
},
onStart() {
Backbone.history.start();
}
});
return {
get instance() {
return app;
},
initialize() {
if (!app) {
const controller = new MainController();
const router = new Router({controller});
app = new App({router});
}
return this;
},
start() {
this.instance.start();
},
}
});
router.js
router.js
define([
'jquery',
'underscore',
'marionette',
], function($, _, Mn) {
return Mn.AppRouter.extend({
initialize(options) {
this.controller = options.controller;
},
appRoutes: {
'': 'index',
'profile': 'profile',
'*notFound': 'notFound'
},
});
});
controllers/main.js
controllers/main.js
define(['jquery', 'underscore', 'marionette', 'app'], function($, _, Mn, app) {
return Mn.Object.extend({
index() {
console.log(app); // undefined
console.log('index method invoked');
/*
i want to do like this
app.showView(new SomeView());
or this.triggerMethod('render', 'someView') and then listen for this event from app.js like this.router.controller.on('render', handler) and dynamic require somehow...
or what is best practice ? iam confused
*/
},
profile() {
console.log('profile method invoked');
},
notFound() {
console.log('notFound method invoked');
}
});
});
推荐答案
您可以在控制器的index
方法内(无论您需要什么位置)异步加载应用程序,而不必将其添加为模块的依赖项
You can asynchronously load the app inside index
method of controller (wherever you need it) rather than adding it as a dependency of module
define(['jquery', 'underscore', 'backbone', 'marionette', 'router','controllers/main'],
function($, _, Backbone, Mn, Router, MainController) {
const App = Mn.Application.extend({
region: '#app',
initialize(options) {
this.router = options.router;
},
onBeforeStart() {
console.log('before start');
},
onStart() {
Backbone.history.start();
}
});
const controller = new MainController();
const router = new Router({
controller
});
return app = new App({
router
});
});
define(['jquery', 'underscore', 'marionette'], function($, _, Mn) {
return Mn.Object.extend({
index() {
require(['app'],function(app){
console.log(app);
});
},
profile() {
console.log('profile method invoked');
},
notFound() {
console.log('notFound method invoked');
}
});
});
这篇关于Marionette JS使用requirejs从控制器访问应用程序的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文