当前版本是 1.x, v0.x 在这里.
让 Web App 有像 Native App 一样的体验.
Demo.
npm install orchids --save
import 'orchids/lib/styles.css';
import { registerPage, startPage, ... } from 'orchids';
registerPage(name, attributes, options);
name:string页面名字.attributes:{}页面属性.beforeCreate: 页面根元素创建之前.created: 页面根元素创建之后.beforeDestroy: 页面根元素销毁之前.destroyed: 页面根元素销毁之后.
options:{}页面配置.options.route:bool默认: true是否向浏览器历史注入一个新的 hash.options.animate:bool默认: true是否使用动画.options.direction:string默认: r2l动画方向: r2l(右到左), l2r(左到右), b2t(底到顶), t2b(顶到底).options.backgroundColor:string默认: #ffffff背景颜色.options.style:{}额外的 Css 样式.
startPage(name, data, options);
name:string页面名字.data:*传递给created钩子的页面数据.
back();
init({ root });
root:DOM默认: document.body根容器.
const page = getPage(index);
index:int默认: 0索引（如果是负数，则倒数取值，如-1为倒数第一个，-2为倒数第二个）.
const page = getRoutePage(index);
index:int默认: 0索引（如果是负数，则倒数取值，如-1为倒数第一个，-2为倒数第二个）.
const length = getPagesLength();
const length = getRoutePagesLength();
const page = getCurrentPage();
const page = getCurrentRoutePage();
const pages = getPages(name);
name:string页面名字，如果为空，则获取所有的页面
const pages = getRoutePages(name);
name:string页面名字，如果为空，则获取所有的路由页面
Page.id: 页面 Id.Page.name: 页面名字.Page.options: 页面配置.Page.el: 页面跟元素(beforeCreate中不能访问).
registerPage('name', {
beforeCreate() {
this.id // ok
this.name // ok
this.options // ok
this.el // not ok
},
});
registerPage('name', {
created() {
this.id // ok
this.name // ok
this.options // ok
this.el // ok
},
});
registerPage('name', {
afterAnimate() {
this // ok
},
});
registerPage('name', {
beforeDestroy() {
this // ok
},
});
registerPage('name', {
destroyed() {
this // ok
},
});
registerPage('name', {
beforeHide() {
this // ok
},
});
registerPage('name', {
afterShow() {
this // ok
},
});