myApp.addView('.view-main', { }); 以上这句代码一定要添加 ，否则链接的页面不能正常加载
---------------------------------------------
如果初始化时定义了preprocess，则页面上链接的自动加载将被拦截 ，需要自己定义每个链接的加载过程
//模版预处理 preprocess: function (content, url, next) { if (url === 'people.html') { var template = Template7.compile(content); var resultContent = template({ title: 'People', people: ['John', 'Ivan', 'Mary'] }) return resultContent; }else{ return content; } } --------------------------------------
获取动态数据加载模版内容
//模版预处理 preprocess: function (content, url, next) { if (url === 'people.html') { // For example, we will retreive template JSON data using Ajax and only after that we will continue page loading process $$.get('fakedata.json', function(data) { var obj = eval('(' + data + ')'); // Template var template = Template7.compile(content); // Compile content template with received JSON data var resultContent = template(obj); // Now we call "next" callback function with result content next(resultContent); }); // Now we shouldn't return anything }else{ return content; } } ----------------------------
preroute早于preprocess执行 ，适合检测用户权限
无论使用 view.router.loadPage('auth.html')还是 view.router.load({ url: "auth.html"});
页面都会报错
Uncaught RangeError: Maximum call stack size exceeded
之所以会报错 大概原因是 加载auth.html时页面也触发了preroute 再次加载 无限循环 导致页面崩溃
可以选择跳出到一个独立页面解决这个问题
preroute: function (view, options) { if (!localStorage.getItem("login")) { view.router.loadPage('auth.html'); //这句话报错 return false; //required to prevent default router action } } －－－－－－－－－－－－－－－－－－
初始化页面的回调：
有时候我们需要页面初始化的回调函数，比如在首页中。但是有一个问题，当我们添加 .onPage 回调的时候，应用已经初始化完成了，我们添加的回调函数不会被触发。有如下几个方法可以解决这个问题: http://docs.framework7.cn/Index/page_callbacks.html
可以利用这段代码，为页面做内容初始化
//当页面初始化时可以回调 onPageInit: function (app, page) { if (page.name === 'index') { console.log(page); } if (page.name === 'home-another') { console.log(page); } } －－－－－－－－－－－－－－－－－－－
返回上一页 用 <a class="back"> ,页面切换的更多设置http://docs.framework7.cn/Index/pages_ajax.html
----------------------------------------
view标签中的data-page属性 指view下众多page中显示的那个
---------------------------------------
一个view中的链接 点击后希望页面在另一个view中呈现，只要在链接 a标签后面加属性 data-view=".另一个view的class名"
－－－－－－－－－－－－－－－－－－－－
点开一个页面 希望这个页面不显示toolbar的做法有两种
1 直接在这个页面的 page 标签增加 no-toolbar 类 比如 <div data-page="about" class="page no-toolbar">
2 在preroute方法 里写viw.hideToolbar(); 可以配合适当的筛选条件
比如
preroute: function (view, options) { view.hideToolbar();} －－－－－－－－－－－－－－－－－－－－－－
通过标签切换视图的例子
http://framework7.taobao.org/docs/tabs.html#.WNACIhJ97aY
------------------------------
不希望页面继续后退可以給 page标签增加 no-swipeback 类class="page no-swipeback"