cvanly
cvanly
  • 发布:2014-09-25 16:40
  • 更新:2015-01-28 11:13
  • 阅读:7384

MUI tab webview 切换不显示nav 怎么办?

分类:MUI
mui

按照HelloMui 给的tab webview写了个例子,单独考过来的时候没有问题,后来在tab首页加载了一些服务器上的数据用来显示,首页没有任何问题,可再点击下面的nav出来的页面就会缺失nav,请问这是什么原因啊?

2014-09-25 16:40 负责人:无 分享
已邀请:
DCloud_UNI_CHB

DCloud_UNI_CHB

用到下拉刷新了吗?

  • cvanly (作者)

    没有用到下拉,只是在"mui-content"中加载了一些数据,很奇怪

    2014-09-26 11:58

  • DCloud_UNI_CHB

    回复 cvanly:你可以从https://github.com/dcloudio/mui更新最新hello mui试试,这个版本已经将选项卡对应页面调整为subpage模式

    2014-09-26 12:11

  • cvanly (作者)

    好,谢谢,我去试下

    2014-09-26 12:19

  • 半杯可乐

    @57 遇到了同样的问题,没有用到下拉刷新,用的是最新的js和css,子页面不在主页面加载,能否帮忙找下问题?

    2014-10-01 10:45

  • DCloud_UNI_CHB

    子页面位置如何定义的呢?或者你可以把源码发我邮箱看看;hbcui1984@gmail.com

    2014-10-01 18:27

HU

HU

同求答案

  • DCloud_UNI_CHB

    可以把代码贴一下,或邮件单独发到hbui1984@gmail.com

    2014-10-15 16:41

  • HU

    就比如Hello Mui的那个例子里面,我想让app一打开就显示的是tab-webview-main.html这个页面,总是失败,链接地址啥的都没错(不是链接地址的事)

    2014-10-15 17:03

  • HU

    已经解决了,是 plus.nav.cloaseSplashScreen()的问题,把他放在read函数里面就OK了

    2014-10-16 11:02

ericdodo

ericdodo

同样问题啊。 我的是使用了右侧滑动菜单,切回来后,点击nav tab,tab条就不显示了。
我饿tab webveiw中使用到了下拉刷新功能。
在线等。。。

DCloud_UNI_CHB

DCloud_UNI_CHB

源码贴一下,最好再上传一下问题截图。

ericdodo

ericdodo

同样问题啊。 使用了右侧滑动菜单,切回来后,点击nav tab,tab条就不显示了。
源代码:
Demo 程序可以重现这个问题,在index.html页面中
mui.init({
swipeBack: false,
statusBarBackground:'#f7f7f7',
subpages: [{
id: 'list',
url: 'examples/tab-webview-main.html',
styles: {
top: '48px',
bottom: 0,
bounce: 'vertical'
}
}]
});
使用tab-webview-main.html替代list.html为装载内容页面。
现象:
在index页面中点击滑动菜单页->正常->切换回index的tab-webveiw-main页面->点击tab nav->sub 页面装载,同时nav bar 被隐藏掉了。
1:下拉加载页面的位置不对了
2:tab-Webveiw-main的 tab 不见了

DCloud_UNI_FXY

DCloud_UNI_FXY

该问题已重现,已经让客户端的同事排查原因了

DCloud_UNI_FXY

DCloud_UNI_FXY

该问题已经修复,后续升级HBuilder及5+客户端后即可

  • ericdodo

    请问新版本计划什么时间投放?

    2015-01-22 09:32

ericdodo

ericdodo

今天更新了1.1, 之前滑动窗口,切换回tab-webView窗口,造成tab-webVeiw中的tab丢失/隐藏的问题得到了修正。

一个新的问题:
在滑动窗口中如果有input 文本控件,发现输入文本后,tab-webView的tab也会丢失掉。

代码:
Demo 程序可以重现这个问题,
1:在index.html页面中
mui.init({
swipeBack: false,
statusBarBackground:'#f7f7f7',
subpages: [{
id: 'list',
url: 'examples/tab-webview-main.html',
styles: {
top: '48px',
bottom: 0,
bounce: 'vertical'
}
}]
});
使用tab-webview-main.html替代list.html为装载内容页面。
2:在index-menu.html中植入一个textarea控件
<textarea>

现象:
textarea输入前


textarea输入后

麻烦请看一下

DCloud_UNI_FXY

DCloud_UNI_FXY

该问题已重现,已经让客户端的同事排查原因了

DCloud_UNI_CHB

DCloud_UNI_CHB

你的页面是三层webview嵌套吗?如果这种情况,5+runtime可能存在bug,建议修改成2层webview,我刚才测试,2层webview没问题。

  • ericdodo

    感谢你的回复!


    我的结构也是两层的。

    在index.html页面,会预加载登陆login.html,主页tab-webveiw.html,以及滑动菜单页面等。

    当然在主页tab-webView中会加载其子页。

    这样的结构有问题吗?

    2015-01-27 19:11

  • DCloud_UNI_CHB

    最好给一个代码示意,不过建议将tab-webview合并到index.html中,这样可以减少一个webview;

    2015-01-28 10:34

  • ericdodo

    代码我贴到下面的回复中去了,麻烦给看看哈

    2015-01-28 11:14

ericdodo

ericdodo

谢谢回复.

比较困惑建议说将tab-webview合并到index.html中。
我的index.html 实际上定义及管理header,启动App时,根据用户登录情况来确定是否直接装载login.html或者tab-webveiw页面。 这两个都是index的subPage。
代码如下:

  mui.plusReady(function () {  
            //nwaiting = plus.nativeUI.showWaiting();//显示原生等待框  
            //1:获取本地user token信息,并检测token合法性  
            var token = userService.GetToken();  
            console.log("token is: " + token);  
            if (token) {  
                //检测token  
                console.log("Has token process");  
                //todo:验证token  
                //userService.VerifyToken(token, verifyTokenCallback);  
                verifyTokenCallback();  
            }  
            else {  
                //2:本地没有token信息,直接走后面的流程  
                console.log("no token process");  
                verifyTokenCallback();  
            }  

            if (mui.os.android) {  
                plus.screen.lockOrientation("portrait-primary");  
            }  

....  
        function verifyTokenCallback() {  
            console.log("verifyTokenCallback  index.html");  
            console.log("IsAuth  "+UserService.prototype.IsAuth);  

            if (UserService.prototype.IsAuth) {  
                //成功认证的用户,将UserService的信息同步到contextMD对象上,并同步到其他subVeiw页面中去  
                contextMD.name = "eric";  
                contextMD.token = UserService.prototype.Token;  
                contextMD.uuid= UserService.prototype.Uuid;  
                //todo:token验证成功,将show main.html  
                createSubPages("pages/main.html");  
            }  
            else {  
                //todo:token验证不成功,或则没有token存在,将show login.html  
                createSubPages("login.html");  
            }  

        };  

....  
      var createSubPages = function (showPage) {  
            var self = plus.webview.currentWebview();  
            nwaiting = plus.nativeUI.showWaiting();//显示原生等待框  
            for (var i = 0; i <= 3; i++) {  
                console.log(showPage);  
                var subView = plus.webview.getWebviewById(subpages[i])  
                if (subpages[i] == showPage) {  
                    //todo:考虑将contextMD对象发送到子页面中去  
                    !subView && (subView = plus.webview.create(subpages[i], subpages[i], style));  
                    self.append(subView);  
                    subView.addEventListener("loaded", function () {  
                        //等动画结束后  
                        setTimeout(function () {  
                            //plus.navigator.closeSplashscreen();  
                            nwaiting.close();  
                        }, 500);  
                    });  

                }  
                else  
                {  
                    (subView) && subView.hide();  
          }  
            }  
...  
var subpages = ['login.html', 'register.html', 'pages/main.html', 'chatForm.html'];  

不知有更好的流程来组织webView吗?

另外:如题,更新1.1Mui后,输入框引起的tab-webView的tab丢失的问题,麻烦跟进一下啊。

  • DCloud_UNI_CHB

    你的底部选项卡是在index.html中还是在main.html中?将选项卡放到index.html中是不是就可以省略main.html了?这样不就可以合并了。

    选项卡丢失的问题,多个webview确实有问题,所以临时绕开办法就是我建议的合并webview。

    2015-01-28 15:22

  • ericdodo

    了解,回头调整下看看。

    2015-01-28 18:15

  • kentang2015

    问题有解决吗??我也是同样的问题,当在webView里面有输入框并输入东西的时候,tab就消失掉。不过调整sub webView的大小(调小一点),发现tab就不会消失,所以我猜测是当在输入框输入时,WebviewStyle就没有神效了,sub webView遮住了parent webView的tab。。不过这样做的话,页面的布局很难看。。 求解决方式。

    2015-05-13 17:09

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