变量和事件暂存

ndoojs支持在页面中间暂存数据和事件，在页面底部基础库加载完成后调用。使用变量或事件暂存，需要在head标签处引入ndoo_prep.js。

1.变量暂存

通过ndoo.vars名称空间来进行变量赋值，在业务逻辑中使用。示例：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>vars</title>
    <script src="js/ndoo_prep.js"></script>
  </head>
  <body>
    <div id="content"></div>
    <script>
      ndoo.vars.getListUrl = '/list';
    </script>
    <div id="scriptArea" data-page-id="home/vars">
      <script src="lib/underscore-min.js"></script>
      <script src="lib/jquery-2.1.1.min.js"></script>
      <script src="lib/Do.js"></script>
      <script src="js/ndoo_all.js"></script>
      <script src="js/homeApp.js"></script>
      <script>
        ndoo.init();
      </script>
    </div>
  </body>
</html>

js/homeApp.js 部分

varsAction: function(param){
  var $content;
  $content = $('#content');
  $content.html('getListUrl: ' + _vars.getListUrl);
}

示例代码：vars

一个常见的应用场景，服务端需要向前端代码传入动态生成的值(比如一个根据路由规则生成的API地址)，并且由某个分部视图在页面中间直接输出js代码。

2.事件暂存

通过ndoo.on API注册事件，等到页面底部时触发。示例：

<div id="content" style="width: 300px; height: 300px;"></div>
<script>
  ndoo.on('PAGE_STATUS_DOMPREP', function() {
    $('#content').css('background-color', '#DDD');
  });
</script><div id="scriptArea" data-page-id="home/eventStack">
  <script src="lib/underscore-min.js"></script>
  <script src="lib/jquery-2.1.1.min.js"></script>
  <script src="lib/Do.js"></script>
  <script src="js/ndoo_all.js"></script>
  <script src="js/homeApp.js"></script>
  <script>
    ndoo.init();
  </script>
</div>

eventStackAction: function(param){
  var $content;
  $content = $('#content');
  $content.html('通过事件暂存改变方块颜色');
}

示例代码：event stack
上例在页面中间使用了事件暂存，监听PAGE_STATUS_DOMPREP事件，并在其中使用jQuery方法。jQuery库在底部加载，上例中ndoo会将事件暂存起来，等到执行ndoo.init以后PAGE_STATUS_DOMPREP事件触发时调用监听代码。
PAGE_STATUS_DOMPREP是ndoojs的一项默认事件，参见：事件参考