Question

saber-firework

移动端MVP开发框架，使用etpl作为模版引擎，结合页面转场与路由管理，提供完整的SPA解决方案。

Usage

var firework = require('saber-firework');

// 加载index配置
firework.load({
    path: '/index',
    action: require('./index')
});

// 启动App
firework.start();

具体请参考使用指南

API

.load(route)

加载路由配置信息

• route {Object|Array.<Object>} 路由配置信息，具体参考doc/route

.start(ele, options)

启动App

• ele {HTMLElement} 容器元素
• options {Object} 全局配置信息，具体参考doc/config

.addFilter(url, fn)

添加在加载页面前执行的filter

• url {string|RegExp=} filter匹配的url或者url正则表达式，如果不设置则filter对所有url都生效
• fn Function(route, next, stop, jump) filter，支持异步操作，有四个参数：
  • route {Object} 路由信息，包括页面URLpath与查询条件query等
  • next {Function} 执行下一个filter
  • stop {Function} 终止页面的加载
  • jump {Function(num)} 跳过后续的filter

最常见的filter有日志统计，权限验证等，例如：

// 对所有`/admin/`路径下的页面添加登录验证
firework.addFilter(/^\/admin\//, function (route, next, stop, jump) {
    if (!isLogin) {
        // 没登录就乖乖去登录
        // 通过直接修改路由信息中的`path`来改变实际加载的页面
        // 同时添加名为`form`的`query`参数，用于登录完成后跳转回之前的页面
        route.query = { from: route.path };
        route.path = '/login';
        // 直接跳过后续的filter
        jump();
    }
    else {
        // 已经登录了
        // 就好好继续执行下一个filter吧
        next();
    }
});

.on(name, fn)

绑定事件

• name {string} 事件名称，具体请参考事件说明
• fn {Function} 事件处理函数

Events

beforeload

加载页面前事件，有两个参数，after待转加载页面信息 与 before当前页面信息

• {Object} after 待转加载页面信息
• {Action} after.action 待转加载的action对象
• {Page} after.page 待转加载的page对象
• {Object} before 当前页面信息
• {Action} before.action 当前的action对象
• {Page} before.page 当前的page对象

beforetransition

转场动画开始前事件，参数同beforeload

afterload

页面加载完成事件，参数同beforeload

error

页面加载失败事件，参数同beforeload

===