主干视图不在pagecreate事件上呈现

时间:2013-01-11 17:56:23

标签: jquery-mobile backbone.js

使用jquery mobile,backbone和require.js构建移动Web应用程序,使其模块化。 我有一个html页面,有这个;

<html>
 <head>
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta http-equiv="Content-type" content="text/html; charset=utf-8">
  <title>DoIt</title>
  <link href="jqm/jquery.mobile-1.2.0.css" rel="stylesheet">

  <script  charset="utf-8" src="jqm/jquery-1.7.2.min.js"></script>
  <script  charset="utf-8" src="jqm/jquery.mobile-1.2.0.min.js"></script>
  <script  charset="utf-8" src="libs/require.js" data-main="app"></script>

</head>

我的app.js文件看起来像这样

//Require.js configuration
require.config({
    paths: {
        'underscore': 'libs/underscore-min',
        'backbone': 'libs/backbone-min',
        'text': 'libs/text'
    },
    shim: {
        'backbone': {
            deps: ['underscore'],
            exports: 'Backbone'
        }
    }
});

require(['backbone', 'views/main'], function (Backbone, AppView) {
    'use strict';
     var view = new AppView();

     $(document).bind('pagecreate', function () {
        view.render(); 
     });
});

这是视图的模板

 <script type="text/html" id="app-view-tmpl">
    <div id="task-creator">
        <input type="text" id="task" placeholder="Enter a task">
        <button data-role="button" data-theme="b">
            Create task
        </button>
    </div>
      </script>

我使用'pagecreate'事件来触发视图的渲染。 视图不会呈现,但会记录我在视图初始化时记录到控制台的其他详细信息。 我做错了什么?

1 个答案:

答案 0 :(得分:0)

我对backbone.js知之甚少,但是在构建它们之后你是否“刷新”你的小部件?

http://jquerymobile.com/demos/1.2.0/docs/lists/lists-methods.html

$("#myListView").listview("refresh");

$("#myButton").button("refresh");

这应该是pagecreate逻辑的一部分。获取模板的其他详细信息会很有帮助。