Question

我刚刚发现了Framework7，它看起来很有希望成为移动应用的基础。

从导航标签我可以加载包含动态数据的组件页面。但是这个数据只在加载应用程序时设置。

通缉：

每次用户点击标签页，加载数据和渲染页面。

问题：如何每次都加载组件页面？

我从 framework7-template-tabs 中做了一个例子。检查控制台显示何时调用 pageInit 。

活：

http://f7-navigate-component-question.surge.sh/

代码：

https://github.com/gotling/framework7-tab-component-page-question

Answer 1

如果您希望每次点击/加载特定标签时都会执行某些操作，则可以使用标签{strong 3}}标记的显示事件。

例如，每次加载tab2时都要发出警告，你可以这样做

$$("#tab2" ).on( "show", function( event, ui ) {
    myApp.alert("Tab loaded!");
} );

Answer 2

我在Framework 7 forum中得到了答案。

收听页面显示事件：

$('#view-catalog').on('tab:show', ...

刷新页面：

$('#view-catalog').on('tab:show', function () {
  catalogView.router.navigate(catalogView.router.currentRoute.url, {
    reloadCurrent: true,
    ignoreCache: true
  });
});

如果使用Framework7 2.0.6 或更新版本可以简化：

$('#view-catalog').on('tab:show', function () {
  viewCatalog.router.refreshPage();
});

Framework7：从选项卡

2 个答案: