如何用 jQuery 做 Framework7 路由？答案

【问题标题】：How to do Framework7 routing with jQuery?如何用 jQuery 做 Framework7 路由？
【发布时间】：2018-04-25 10:08:42
【问题描述】：

我正在使用 Framework7 开发一个混合移动应用程序。我成功完成了用户界面，现在我想向我的应用程序添加功能。我的问题是从一个 .html 导航到另一个。在用户界面上，我使用链接进行导航，如下所示：

<a href="/homepage/" class="button button-fill button-login">LOGIN</a>

由于一些检查，我删除了整个 href-tag，这里我遇到了问题，如何在 jQuery 中进行此链接？

我尝试了很多，也遵循了公开的“Router JavaScript API”（https://v1.framework7.io/docs/router-api.html），但效果不佳（注意：这不是我的全部代码，只是受影响的部分）：

尝试 1

var myApp = new Framework7 ({}); var mainView = myApp.views.add('.view-main');

var 应用程序 = { 初始化：函数（）{ events.doClickFunctions(); }, 登录： { 成功：函数（）{ //这里应该是链接完成 mainView.router.load('/homepage/'); } } };

问题：“myApp.views.add 不是函数”

尝试 2

var myApp = new Framework7 ({}); var mainView = myApp.addView('.view-main');

var 应用程序 = {

    init: function () {
        events.doClickFunctions();
    },
    login: {
        success: function () {
            //here should be the linking done
            mainView.router.load('/homepage/');
        }
    }
};

问题：“myApp.addView 不是函数”

我尝试了一些其他组合，但没有任何效果。

此外，我做了一个解决方法：如果检查成功，将使用 jQuery 添加 href 属性，并在元素上进行虚拟点击。所以用户体验就像我想要的那样，但我想这不是它应该如何工作的？

提前谢谢你！

【问题讨论】：

您使用的是哪个版本的框架？
我使用的是Framework7 2.1.3
你需要添加路由器。你添加了吗？在 Framework7 中检查路由器。

标签： javascript jquery html-framework-7

【解决方案1】：

试试这个

        var app = new Framework7({
  id: 'io.framework7.testapp',
  precompileTemplates: true, //
  template7Pages: true,
  root: '#app',
  theme: theme,
  cache: false ,/* disable caching */
  data: function () {


  },
  methods: {
    helloWorld: function () {
      app.dialog.alert('Hello World!');
    },
  },
  routes: routes,
  vi: {
    placementId: 'pltd4o7ibb9rc653x14',
  }
});
app.views.main.router.navigate('/login/');

在 jq 中路由到另一个页面使用这个：

  app.views.main.router.navigate('/login/');

【讨论】：