1***@163.com
1***@163.com
  • 发布:2019-04-18 10:56
  • 更新:2019-04-18 11:09
  • 阅读:1292

【报Bug】webview 打不开

分类:HBuilderX

详细问题描述

使用了webview 打不开页面

[内容]

<template>    

<scroll-view  @scroll="test">  
    <!-- <view class="news banner">  

        <view class="news-top-imgs">  

            <view class="page-section swiper">  
                <view class="page-section-spacing">  
                    <swiper class="swiper" :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration">  
                        <view v-for="(slid,index) in detailData.slideshow"  :key="index" >  
                            <swiper-item>  
                                <view class="swiper-item bar-img" :style="{backgroundImage: 'url('+dataUrl+'upload/'+slid+')'}"></view>  
                            </swiper-item>  
                        </view>  
                    </swiper>  

                </view>  
            </view>  
        </view>  
        <view class="news-title bar">  

                <text class="news-title-text">{{detailData.title}}</text>  
                <view class="news-title-time">  
                    <text class="news-title-time-t1">3小时前</text>  
                    <text class="news-title-time-t1">3654阅读</text>  
                </view>  
        </view>  
        <view class="news-comtent bar content">  

        </view>  
        <view class="news-comment-list bar">  
            <view class="news-comment-bar">  
                <text class="news-comment-bar-text">全部评论:</text>  
                <text class="news-comment-bar-number">({{commentCount}})</text>  
            </view>  
            <view class="comment-none" v-if="contentData.length < 1">  
                    <text class="correlation-video-title">暂无评论!</text>  
            </view>  
            <view v-for="(item, index) in contentData" :key="index">  
                <view class="news-comment-t1">  
                    <view class="news-comment-info">  
                        <image class="news-comment-info-img" :src="item.user_img===null?defaultImg:item.user_img"></image>  
                        <view class="news-comment-info-t2">  
                            <text class="news-comment-info-text">{{item.user_name===null?'无名猫猫':item.user_name}}</text>  
                            <text class="news-comment-info-time">{{item.add_time}}</text>  
                        </view>  
                    </view>  
                    <view class="news-comment-content">  
                        <view class="news-comment-content-t1">  
                            <text class="news-comment-content-text">{{item.content}}</text>  
                        </view>  

                    </view>  
                </view>  
            </view>  
        </view>  
        <chat-input @send-message="send_comment" @blur="blur" :focus="focus" ></chat-input>  
        <view class="news-bottom bar" v-if="focus===false">  

            <view @click="onInputClick()">  
                <input type="text" disabled="disabled" class="news-bottom-input" @input="confirmData"  @confirm="confirmSub" placeholder="我来说一说..."  v-model="sayText" />  

            </view>  
            <view class="news-bottom-img">  
                <image class="news-bottom-img-t1" :src="icons[0]"/>  
                <image class="news-bottom-img-t1 share" :src="icons[1]" />  
                <image class="news-bottom-img-t1" :src="icons[2]" @click="onLike(detailData.id)"></image>  
            </view>  
        </view>  
    </view>  -->  

    </scroll-view>  
</template>  

<script>  
    import chatInput from '../../components/input/chatinput.vue'; //input框  
    import uParse from '../../components/uParse/src/wxParse.vue'  
    import commonData from '@/common/commonData.js';  
    export default {  
        data() {  
            return {  
                banner: {},  
                detailData:{},  

                dataUrl:'',  
                nid:'',  
                indicatorDots: true,  
                autoplay: true,  
                interval: 2000,  
                duration: 500,  
                commentCount:0,  
                defaultImg:'../../static/touxiang15@3x.png',  
                uid:0,  
                icons:[  
                    '../../static/icon1@2x.png',  
                    '../../static/icon2@2x.png',  
                    '../../static/icon3@2x.png',  
                ],  
                contentData:[],  
                focus: false, //是否自动聚焦输入框  
                height:'500upx',  
            }  
        },  
        components:{uParse,chatInput},  
        onShareAppMessage() {  
            return {  
                title: this.banner.title,  
                path: '/pages/detail/newsDetails?query=' + JSON.stringify(this.banner)  
            }  

        },  
        onLoad(event) {  
            // 目前在某些平台参数会被主动 decode,暂时这样处理。  
            try {  
                this.banner = JSON.parse(decodeURIComponent(event.query));  
            } catch (error) {  
                this.banner = JSON.parse(event.query);  
            }  

            this.getDetail();   //获取文章内容  
            this.getComment();  //获取评论列表  
            this.dataUrl = commonData.requestUrl;  
            uni.setNavigationBarTitle({  
                title: this.banner.title  
            });  
            this.webview();       
        },  
        methods: {  
            test:function(e){  
                console.log(e)  
            },  
            webview(){  
                var pages = getCurrentPages();    
                var page = pages[pages.length - 1];    
                // #ifdef APP-PLUS    
                var currentWebview = page.$getAppWebview();    
                // #endif    

                // let webviewUrl = commonData.requestUrl+'AWebview/H5forShow/'+this.banner.id;  
                let webviewUrl = 'http://wsd.591hufu.com/price';  

                var pusher = plus.webview.open(webviewUrl,'style',{  
                    top:'10px',left:'0px',width:'100%',  position: 'static',  
                });    
                currentWebview.append(pusher);   
            },  
            getDetail() {  
                let that = this;  
                uni.request({  
                    url: commonData.requestUrl+'ANews/getNewsDetails/' + that.banner.id,  
                    success: (result) => {  
                        if (result.data.status == 200) {  
                            /* this.content = result.data.result[0].content;  
                            this.title = result.data.result[0].title;  
                            this.slideshow = result.data.result[0].resource.split(','); */  
                            let content = result.data.result[0].content;  
                            let detailsData = {  
                                "content":content,  
                                "title":result.data.result[0].title,  
                                "slideshow":result.data.result[0].resource.split(','),  
                                "id":result.data.result[0].id,  
                            }  
                             that.nid = result.data.result[0].id;  

                             that.detailData = detailsData;  

                        } else {  
                            that.content = '';  
                        }  
                    }  
                });  
            },  
            getComment(){  
                let that = this;  
                uni.request({  
                    url: commonData.requestUrl+'Aattention/CommentList',  
                    method:'POST',  
                    header: {  
                     'content-type': 'application/x-www-form-urlencoded',   
                    },  
                    data:{  
                        nid:that.banner.id,  
                        type:2,  
                    },  
                    dataType:'json',  
                    success: (result) => {  
                        let backData = result.data;   

                        if (backData.status == 200) {  
                            that.contentData = backData.result;  

                            that.commentCount = backData.count;  
                            //console.log("请求成功!");  
                                this.init_input();  
                        }else if(backData.status == 500){  
                            console.log("请求失败!");  
                        }  

                    }  
                });  
            },  
            onInputClick(){  
                this.focus = true;  
                console.log("focus.226"+this.focus);  
            },  
            onLike(nid) {  
                console.log(nid);  
                let that = this;  
                uni.getStorage({  
                      key: 'LoginData',  
                      success: function (res) {  
                       if(res.data !=''){  
                          that.uid = res.data;  
                          that.likes(that.uid,nid);  
                       }  
                      },  
                      fail:function(error){  
                            uni.navigateTo({  
                                url: '/pages/login/index'  
                            });  
                      }  
                });  

            },  
            likes(uid,nid){  
                uni.request({  
                    url: commonData.requestUrl+'Aattention/OnLike',  
                    method:'POST',  
                    header: {  
                     'content-type': 'application/x-www-form-urlencoded',   
                    },  
                    data:{  
                        uid:uid,  
                        nid:nid  
                    },  
                    dataType:'json',  
                    success: (result) => {  
                        let backData = result.data;       
                        if (backData.status == 200) {  

                            uni.showToast({  
                                 title: "成功点赞!",    
                            });  
                        }else if(backData.status == 500){  
                            uni.showToast({  
                                 title: "点赞失败!",    
                            });  
                        }  

                    }  
                });  
            },  
            blur: function() {  
                this.init_input();  
            },  
            send_comment: function(message) {  

                /* let that = this;  
                let discussData = message.content;  
                 let addData = {  
                    name:'你的名字',  
                    src:'../../static/touxiang15@3x.png',  
                    time:'刚刚',  
                    message:discussData,  
                 };  

                this.contentData.unshift(addData); */  
                let that = this;  
                uni.getStorage({  
                      key: 'LoginData',  
                      success: function (res) {  
                       if(res.data !=''){  
                          that.uid = res.data;//获取用户的ID  
                          that.sub_Comment(that.uid,message.content);  
                       }  
                      },  
                      fail:function(error){  
                            uni.navigateTo({  
                                url: '/pages/login/index'  
                            });  
                      }  
                });  

                this.init_input();  
            },  
            sub_Comment(uid,contents){  
                uni.request({  
                    url: commonData.requestUrl+'Aattention/SubComment',  
                    method:'POST',  
                    header: {  
                     'content-type': 'application/x-www-form-urlencoded',   
                    },  
                    data:{  
                        uid:uid,  
                        nid:this.nid,  
                        content:contents,  
                        type:2,     //注意 评论的类型 1.动态 2.资讯 3.课程 后续添加的时候记得数据库备份  
                    },  
                    dataType:'json',  
                    success: (result) => {  
                        let backData = result.data;       
                        if (backData.status == 200) {  
                            this.contentData = backData.result;  
                            this.commentCount = backData.count;  

                            uni.showToast({  
                                 title: "评论成功!",    
                            });  
                        }else if(backData.status == 500){  

                            uni.showToast({  
                                 title: "评论失败!",    
                            });  
                        }  

                    }  
                });  
            },  
            init_input() {  
                this.focus = false;  
                this.discussData = '';  
                this.sayText = '';  
            },  

        }  
    }  
</script>  

<style>  
    .content{  
        height: 200upx;  
    }  
    .comment-none{  
        display: flex;  
        flex-direction: row;  
        justify-content: center;  
        margin-top: 50upx;  
    }  
    .bar-img{  
        background: no-repeat;  
        background-size: 100%;  
    }  
    .swiper {  
        height: 427upx;  
    }  
    .swiper-item {  
        display: block;  
        height: 427upx;  
        line-height: 300upx;  
        text-align: center;  
    }  

    .swiper-list {  
        margin-top: 40upx;  
        margin-bottom: 0;  
    }  

    .uni-common-mt{  
        margin-top:60upx;  
        position:relative;  
    }  

    .info {  
        position: absolute;  
        right:20upx;  
    }  
</style>  

<style>  

    .news-comment-content{  
        width: 670upx;  
        display: flex;  
        justify-content: flex-end;  
        margin-top: 25upx;  
    }  
    .news-comtent {  
        margin: 54upx 0upx;  
    }  
    .news-comment-bar{  
        padding-top: 61upx;  
        border-top-style: solid;  
        border-top-width: 1upx;  
        border-top-color: RGBA(241, 242, 245, 1);  
    }  
    .news-comment-content-text{  
        height:30upx;  
        font-size:32upx;  
        font-family:PingFang-SC-Medium;  
        font-weight:500;  
        color:rgba(35,39,44,1);  
    }  
    .news-comment-content-t1{  
        width: 576upx;  
    }  
    .news-comment-info{  
        height: 80upx;  
        display: flex;  
        flex-direction: row;  
        align-items: center;  
    }  

    .news-comment-info-img{  
        width:80upx;  
        height:80upx;  
        border-radius:40upx;  
        margin-right: 15upx;  
    }  
    .news-comment-t1{  
        margin-top: 61upx;  
    }  
    .news-comment-info-text{  
        width:347upx;  
        height:27upx;   
        font-family:PingFang-SC-Medium;  
        font-weight:500;  
        color:rgba(35,39,44,1);  
        line-height:40upx;  
    }  
    .news-comment-info-time{  
        width:347upx;  
        height:21upx;  
        font-size:21upx;  
        font-family:PingFang-SC-Medium;  
        font-weight:500;  
        color:rgba(35,39,44,1);  
        line-height:31upx;  
        opacity:0.3;  

    }  
    .news-comment-info-t2{  
        display: flex;  
        flex-direction: column;  
        justify-content: space-between;  
        height: 61upx;  
    }  
    .news-comment-bar-text{  
        width:138upx;  
        height:32upx;  
        font-size:32upx;  
        font-family:PingFang-SC-Bold;  
        font-weight:bold;  
        color:rgba(35,39,44,1);  
    }  

    .news-comment-bar-number{  
        width:97upx;  
        height:31upx;  
        font-size:32upx;  
        font-family:PingFang-SC-Medium;  
        font-weight:500;  
        color:rgba(35,39,44,1);  
        opacity:0.6;  
    }  
    .bar{  
        padding: 0upx 40upx;  
    }  

    .news-top-imgs{  
        width: 750upx;  
    }  

    .news-top-imgs-t1{  
        width: 750upx;  
        height: 400upx;  
        border-radius: 0upx;  
    }  

    .news-title{  
        margin-top: 16upx;  
    }  

    .news-title-text{  
        width:660upx;  
        height:108upx;  
        font-size:32upx;  
        font-family:PingFang-SC-Bold;  
        font-weight:bold;  
        color:rgba(35,39,44,1);  
        line-height:54upx;  
    }  
    .news-title-time{  
        display: flex;  
        justify-content: space-between;  
        margin-top: 27upx;  
        padding-bottom: 38upx;  
        border-bottom-style: solid;  
        border-bottom-width: 1upx;  
        border-bottom-color: RGBA(244, 244, 246, 1);  
    }  
    .news-title-time-t1{  
        height:54upx;  
        font-size:24upx;  
        font-family:PingFang-SC-Medium;  
        font-weight:500;  
        color:rgba(35,39,44,1);  
        line-height:54upx;  
        opacity:0.5;  
    }  

    .news-bottom-input{  
        width:421upx;  
        height:67upx;  
        background:rgba(242,242,242,1);  
        border-radius:33upx;  
        font-size:25upx;  
        font-family:PingFang-SC-Medium;  
        font-weight:500;  
        padding-left: 29upx;  
        margin: 15upx 0upx;  
    }  
    .news-comment-list{  
        margin-bottom: 120upx;  
        padding-bottom: 100upx;  
    }  
    .news-bottom{  
        border-top-style: solid;  
        border-top-width: 1upx;  
        border-top-color: RGBA(249, 249, 249, 1);  
        background-color: RGBA(255, 255, 255, 1);  
        display: flex;  
        align-items: center;  
        position:fixed;   
        bottom:0;  
        width: 700upx;  

    }  
    .news-bottom-img-t1{  
        width: 35upx;  
        height: 35upx;  
    }  
    .news-bottom-img{  
        width: 220upx;  
        text-align: right;  
        margin-left: 26upx;  
        margin-right: 30upx;  
        height: 36upx;  
    }  

    .share{  
        margin: 0upx 39upx;  
    }  
</style>  

[步骤]

[结果]

[期望]

IDE运行环境说明

[HBuilder 或 HBuilderX。如果你用其他工具开发uni-app,也需要在此说明]

[IDE版本号]

[windows版本号]

[mac版本号]

uni-app运行环境说明

[运行端是h5或app或某个小程序?]

[运行端版本号]

[项目是cli创建的还是HBuilderX创建的?如果是cli创建的,请更新到最新版cli再试]

[编译模式是老模板模式还是新的自定义组件模式?]

App运行环境说明

[Android版本号]

[iOS版本号]

[手机型号]

[模拟器型号]

附件

[IDE问题请提供HBuilderX运行日志。菜单帮助-查看运行日志,点右键打开文件所在目录,将log文件压缩成zip包上传]

[App问题请提供可重现问题的代码片段,你补充的细一点,问题就解决的快一点]

[App安装包或H5地址]

[可重现代码片段]

联系方式

[QQ]

2019-04-18 10:56 负责人:无 分享
已邀请:
Trust

Trust - 少说废话

HBuilderX 1.9.2 完整的测试代码:

<template>  
    <view>  
        <button type="primary" @click="webview">click me</button>  
    </view>  
</template>  
<script>  
    export default {  
        methods: {  
            webview() {  
                const currentWebview = this.$mp.page.$getAppWebview();  
                // let webviewUrl = commonData.requestUrl+'AWebview/H5forShow/'+this.banner.id;    
                let webviewUrl = 'http://wsd.591hufu.com/price';  

                var pusher = plus.webview.open(webviewUrl, 'style', {  
                    top: '10px',  
                    left: '0px',  
                    width: '100%',  
                    position: 'static',  
                });  
                currentWebview.append(pusher);  
            }  
        },  
    }  
</script>  
<style>  

</style>

测试结果

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