在Framework7中也是可以使用路由的，和Angularjs的路由有些不同，详细信息可以参考文档：http://docs.framework7.cn/Index/router_api.html，接下来说一下如何使用。
使用方法
var mainView = myApp.addView('.view-main');//加载页面你得先需要一个视图 mainView.router.load(options);//把一个页面加载到当前视图 mainView.router.back(options);//这个方法会触发一个反向的动画并回到上一个页面，也就是浏览历史上的回退options常用参数列表
| 参数 | 类型 | 说明 |
|---|---|---|
| url | string | 需要加载的页面的URL |
| pageName | string | 需要加载的页面的名称(data-page)。只用在内联页面(DOM cached)。 |
| context | object or array | 渲染Template7 模板时需要的上下文。这里有更多说明Template7 Pages。 |
| force | boolean | 可选的。只对 back 方法有效。如果设置为 true，那么会忽略浏览历史中的上一个页面，而是直接加载指定的页面。 |
使用举例
detaile.html <div> 姓名：<span>{
{
name}}
span> 性别：<span>{
{
sex}}
span> 年龄：<span>{
{
age}}
span>
div>mainView.router.load({ //加载单独页面page url:'f7/detaile.html',//页面的url context:{
//传入detail页面的数据，可以在页面中渲染 name:'张三', sex:'男', age:'30' } });mainView.router.load({ //加载内联页面page pageName:'detaile',//页面的data-page值 context:{
//传入detail页面的数据，可以在页面中渲染 name:'张三', sex:'男', age:'30' } });mainView.router.back();//简单的返回上一个页面，不需要参数mainView.router.back({ //返回指定页面，一般用于返回到主页 pageName:'detaile',//页面的data-page值 force:true//注意此参数back方法专用 });注意：在使用路由(load/back)内联页面时，一定要在var mainView = myApp.addView('.view-main');时添加domCache: true，如：var mainView = myApp.addView('.view-main',{domCache: true});
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请联系我们举报，一经查实，本站将立刻删除。
发布者：全栈程序员-站长，转载请注明出处：https://javaforall.net/216524.html原文链接：https://javaforall.net
