框架 7 页面未加载

Question

我尝试使用 Framework7 核心（没有节点、React、Vue）创建一个网络应用程序。

我发现点击index.html底部的标签页没有显示出来。

Here 你可以看到我的文件（来自 framework7 模板）。

我不明白为什么它们不动态加载。

  <!-- Catalog View -->
  <div id="view-catalog"  class="view view-init tab" data-view="catalog" data-url="/catalog/">
    <!-- Catalog page will be loaded here dynamically from /catalog/ route -->
  </div>

  <!-- Settings View -->
  <div id="view-settings" class="view tab">
    <!-- Settings page will be loaded here dynamically from /settings/ route -->
  </div>

路由数组：

routes = [
  {
    path: '/',
    url: '../pages/index.html',
  },
  {
    path: '/about/',
    url: '../pages/about.html',
  },
  {
    path: '/catalog/',
    componentUrl: '../pages/catalog.html',
  },
  {
    path: '/product/:id/',
    componentUrl: '../pages/product.html',
  },
......
]

Answer 1

您的问题仅在路线上，您需要从这里更改路线

  {
    path: '/catalog/',
    componentUrl: '../pages/catalog.html',
  },
  {
    path: '/product/:id/',
    componentUrl: '../pages/product.html',
  },

对此：

  {
    path: '/catalog/',
    componentUrl: './pages/catalog.html',
  },
  {
    path: '/product/:id/',
    componentUrl: './pages/product.html',
  },

它会完美运行，当你使用..时，你会后退一步，这样你就找不到页面，使用.你将直接访问网络目录...