1

我正在尝试制作一个简单的 Backbone Web 应用程序。我正在使用 require 来管理我的所有依赖项。我的html很简单:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <link rel="stylesheet" type="text/css" href="./css/todos.css">
    <title>Clinical Auth</title>
    <script type="text/javascript" src="js/lib/require-2.1.1.js" data-main="js/app"></script>
  </head>
  <body>
    <div id="container"></div>
  </body>
</html>

我的 app.js 只是一个调用我的 application.view.js 的路由器:

require([
    'backbone',
    'views/application.view'
  ], function(Backbone, app) {
  var Router = Backbone.Router.extend({
    routes: {
      "": "main"
    },

    main: function(){
      var appView = new app();
      appView.render();
    }
  });

  var router = new Router();
  Backbone.history.start();
});

如您所见,我在路线标题中启动我的应用程序main。我的 application.view.js 也很简单。

define(function(require) {
  "use strict";

   var Backbone = require('backbone');
   var $  = require('jquery');
   var AppView = Backbone.View.extend({
    el:  $('#container'),
    render: function() {
      $(this.el).append("<div>hello world</div>");
      return this;
    }
  });

  return AppView;
});

另外,这是我的 require.config 文件:

require.config({
  baseUrl: "./js/",
  paths: {
    jquery: 'lib/jquery-1.8.2',
    underscore: 'lib/underscore-1.4.2',
    backbone: 'lib/backbone-0.9.2',
    'backbone.localStorage': 'lib/backbone.localStorage'
  },
  shim: {
    underscore: {
      exports: "_"
    },
    backbone: {
      deps: ['underscore', 'jquery'],
      exports: 'Backbone'
    },
    'backbone.localStorage': {
      deps: ['backbone'],
      exports: 'Backbone'
    }
  }
});

当我在主路由中设置断点时,我可以看到container正在被操纵,但它永远不会出现在我的屏幕上。我究竟做错了什么?我知道这将是一件简单的事情,但我正在拔头发。

4

1 回答 1

0

这段代码没有问题。我有一个 CSS 文件,将container元素显示属性设置为none. 很抱歉浪费大家的时间。

于 2013-08-09T15:48:58.253 回答