5个萝卜
5个萝卜
  • 发布:2017-09-05 14:33
  • 更新:2017-09-05 15:01
  • 阅读:1410

顶部选项卡-可左右拖动(webview)

分类:MUI
mui

在官方示例 顶部选项卡-可左右拖动(webview) 中使用webviewGroup.js,
var group = new webviewGroup(plus.webview.currentWebview().id, {
items: [{
id: "tab-top-subpage-1.html",
url: "tab-top-subpage-1.html",
extras: {}
}, {
id: "tab-top-subpage-2.html",
url: "tab-top-subpage-2.html",
extras: {}
}, {
id: "tab-top-subpage-3.html",
url: "tab-top-subpage-3.html",
extras: {}
}, {
id: "tab-top-subpage-4.html",
url: "tab-top-subpage-4.html",
extras: {}
}, {
id: "tab-top-subpage-5.html",
url: "tab-top-subpage-5.html",
extras: {}
}],
onChange: function(obj) {
var c = document.querySelector(".mui-control-item.mui-active");
if(c) {
c.classList.remove("mui-active");
}
document.querySelector(".mui-scroll .mui-control-item:nth-child(" + (parseInt(obj.index) + 1) + ")").classList.add("mui-active");
}
});

如果我的tab-top-subpage-1.html 到 tab-top-subpage-5.html这几个页面都是一样的,就是里面展示的数据不同,也要这样建5个子页面的,有没有别的方法解决?

我现在是有9个界面相同的子页面,只是里面显示的数据不同而已,数据是后台动态获取的,只能用这种方法建9个相同的子页面吗?

2017-09-05 14:33 负责人:无 分享
已邀请:
回梦無痕

回梦無痕 - 暂停服务

url: "tab-top-subpage-3.html"

上面这个可以相同的。。。。
只需要ID不同即可生成不同的子页面。

  • 5个萝卜 (作者)

    谢谢

    2017-09-05 15:08

  • 5个萝卜 (作者)

    条目比较多时候,选项卡的头部好像不好跟着内容滑动,这个有办法解决吗?

    2017-09-05 15:21

DCloud_heavensoft

DCloud_heavensoft

如果使用div方式的选项卡,会遇到在低端机上拖动卡顿的情况,除非你的dom非常简单。
如果使用Webview方式,就需要创建不同的子页面。复用问题可以通过预编译工具解决。

  • 5个萝卜 (作者)

    预编译工具?怎么用的啊

    2017-09-05 15:06

  • 5个萝卜 (作者)

    而且条目比较多时候,选项卡的头部好像不好跟着内容滑动,这个有办法解决吗?

    2017-09-05 15:21

  • DCloud_heavensoft

    回复 5个萝卜:div选项卡就这样,dom复杂后,渲染就卡,头部的位置重绘很慢。预编译工具很多啊,比如webpack、glup、grunt

    2017-09-24 06:21

该问题目前已经被锁定, 无法添加新回复