Requirejs + Backbone Uncatch TypeError: 無法讀取未定義的屬性「Model」
Requirejs + Backbone Uncaught TypeError: Cannot read property 'Model' of undefined
我一直从Backbone开始。我使用需要加载模块并收到此错误。谁能解释一下?在文件用户中.js当我尝试创建Backbone.Model.extend时,我遇到了这个错误。我使用了 Backbone.js 0.9.10、jQuery v1.9.0、RequireJS 2.1.4、Underscore 1.4.4。谢谢。
索引.html
<!doctype html>
<html lang="en">
<head>
<title></title>
<!-- Load the script "js/main.js" as our entry point -->
<script data-main="js/main.js" src="js/libs/require/require.js"></script>
<link rel="stylesheet" type="text/css" href="stylesheets/style.css">
</head>
<body>
<div id="container">
<div id="menu"></div>
<div id="content"></div>
</div>
</body>
</html>
主.js
require.config({
paths:{
jquery:'libs/jquery/jquery-min',
underscore:'libs/underscore/underscore-min',
backbone:'libs/backbone/backbone-min',
templates:'../templates'
}
});
require(['app'], function (App) {
console.log('____main.js')
App.initialize();
console.log('main.js')
});
应用.js
define(['jquery', 'underscore', 'backbone', 'router'], function($, _, Backbone, Router) {
var initialize = function(){
Router.initialize();
console.log('app.js');
};
return {
initialize: initialize
};
});
路由器.js
define([
'jquery',
'underscore',
'backbone',
'views/home/login'
//'views/room',
// 'views/friend',
// 'views/play',
// 'views/money'
], function ($, _, Backbone, loginView) {
console.log('router.js');
var AppRouter = Backbone.Router.extend({
routes:{
'/home':'showHome',
'*actions':'defaultAction'
},
showHome:function () {
loginView.render();
},
defaultAction:function (actions) {
console.log('No route:', actions);
}
});
var initialize = function(){
var app_router = new AppRouter;
Backbone.history.start();
};
return {
initialize: initialize
};
});
登录.js(骨干视图)
define([
'jquery',
'underscore',
'backbone',
'collections/home/users',
'text!templates/home/login.html'
], function($, _, Backbone, usersCollections, homeLoginTemplate){
var loginView = Backbone.View.extend({
el: $('container'),
render: function(){
var data = {};
var compiledTemplate = _.template(homeLoginTemplate);
this.el.append(compiledTemplate);
}
});
console.log('login.js');
return new loginView;
});
用户.js(主干模型)
define([
'underscore',
'backbone'
], function (_, Backbone) {
console.log('user model');
var userModel = Backbone.Model.extend({
default:{
username:"",
password:""
}
});
return userModel;
});
用户.js(主干集合)
define(['underscore', 'backbone', 'models/user'], function (_, Backbone, userModel) {
console.log('user collection');
var usersCollection = Backbone.Collection.extend({
model:userModel
});
return new usersCollection;
});
我无法发布我的照片。但是您可以在此链接中看到 http://imageshack.us/photo/my-images/809/devi.jpg/。
使用@Ingro所说的那个,并在调用渲染模板时尝试使用默认下划线标记。
例如:
主.js
require.config({
paths:{
jquery:'libs/jquery/jquery-min',
underscore:'libs/underscore/underscore-min',
backbone:'libs/backbone/backbone-min',
templates:'../templates'
},
shim: {
backbone: {
deps: ['jquery','underscore'],
exports: 'Backbone'
}
}
});
require(['app'], function (App) {
console.log('____main.js')
App.initialize();
console.log('main.js')
});
在您使用下划线模板的任何文件中,例如您的"登录.js",请使用以下内容:
define([
'backbone',
'collections/home/users',
'text!templates/home/login.html'
], function(Backbone, usersCollections, homeLoginTemplate){
var loginView = Backbone.View.extend({
el: $('container'),
render: function(){
var data = {};
var compiledTemplate = _.template(homeLoginTemplate);
this.el.append(compiledTemplate);
}
});
console.log('login.js');
return new loginView;
});
jQuery和Underscore在骨干需要调用中默认使用。我希望这些对您有所帮助。
也许您在主文件中缺少一些填充码配置.js请阅读:http://requirejs.org/docs/api.html#config-shim
您可以尝试添加:
shim: {
'backbone': {
deps: ['jquery','underscore'],
exports: 'Backbone'
}
}
相关文章:
- Ember Data DS.Model's set函数不起作用
- C#asp.net mvc Set CheckBoxFor已检查的具有Model Value的属性
- Rails将JavaScript对象存储到Model的有效方式
- 从 Javascript 中设置 ng-model name
- Nano Scroller在引导程序DropDown和Model Box中不起作用
- Model中的Typeahead返回空值以形成输入字段
- 动态地从“;joint.shapes.devs.Model”;JointJS
- 如何修改或类似@model.count的内容,根据单元格值计算行数
- 我收到此错误Uncatch TypeError:this.getElements不是一个函数
- Toggle Switch在包含ng model和ng repeat之后不进行切换
- 在Angularjs中,我如何使用ng repeat、ng model和ng click来动态更改内容
- Backbone model.change() not firing
- mongoose.js Model.remove在循环中只能工作一次
- vue-js-单选按钮won't默认情况下使用v-model属性进行检查
- 当与之关联的 ng-model 为 false 时,Angularjs 复选框值不会取消选中
- 从node.js应用程序调用Mongoose Model.save()时挂起
- AngularJS:在使用嵌套的JQuery Sortables时保持Dom和Model同步
- Ember cli Uncatch TypeError: undefined 不是函数
- ng-model 绑定到选择标签生成的空默认值
- Requirejs + Backbone Uncatch TypeError: 無法讀取未定義的屬性「Model」