黑子
黑子
  • 发布:2021-04-29 22:55
  • 更新:2021-04-30 00:08
  • 阅读:972

【报Bug】发现重大BUG- SUBNVUE下调用Video,createVideoContext的方法失效

分类:uni-app

产品分类: uniapp/App

PC开发环境操作系统: Windows

PC开发环境操作系统版本号: win10

HBuilderX类型: 正式

HBuilderX版本号: 3.1.10

手机系统: Android

手机系统版本号: Android 11

手机厂商: 小米

手机机型: 黑鲨2pro&小米max&MUMU模拟器

页面类型: nvue

vue版本: vue2

打包方式: 云端

项目创建方式: HBuilderX

示例代码:

代码附件中

操作步骤:
  1. 解压附件,将文件导入项目,并且配置一下pages.json
  2. 注意在ivideo.nvue里面有一个播放和暂停的按钮
  3. 新建一个index.vue,pages.json 配置app-plus ,配置页面 subNvue/live.nvue
  4. 进入index.vue,会自动呈现 subnvue内容,会呈现ivideo的内容,点击播放和暂停按钮均无任何效果

PS: 不采用 app-plus的方式运行,直接启动live.nvue页面,点击里面的暂停和播放按钮又是正常的

预期结果:

点击播放和暂停按钮均无任何效果
不采用 app-plus的方式运行,直接启动live.nvue页面,点击里面的暂停和播放按钮又是正常的

实际结果:

解决此BUG,可以正常的调用play函数和stop函数还有pause函数

bug描述:

index.vue vue页面
subNvue/live.nvue //nvue页面
ivideo.nvue //封装的video组件

page配置了启动页面


"condition": {  
        //模式配置,仅开发期间生效  
        "current": 0, //当前激活的模式(list 的索引项)  
        "list": [{  
            "name": "", //模式名称  
            "path": "pages/subNvue/live", //启动页面,必选  
            "query": "" //启动参数,在页面的onLoad函数里面得到  
        }]  
    }*/

pages/subNvue/live 就是 live.nvue

启动运行一切正常,stop,play函数有正常的效果

index 页面配置

 {  
            "path": "pages/live/index",  
            "style": {  
                "navigationStyle": "custom",  
                "navigationBarTitleText": "直播",  
                "app-plus":{  
                    "subNVues":[{  
                        "path":"pages/subNvue/live",  
                        "id":"liveVideo",  
                        "style":{  
                            "position":"absolute",  
                            "height":"630rpx",  
                            "top":"0px",  
                            "backgroundColor":"transparent"  
                        }  
                    }]  
                }   
            }  
        }

在index页面添加了了一个630高度的播放器,运行之后,看起来没有问题,但是接口失效

下面的停止按钮和暂停和播放都无反应,不报错

<script>  
{  
methods:{  
    stop() {  
    this.videoCtx.stop() //停止不报错,但是视频依然播放  
    console.log('stop...')  
    },  
    pause() {  
    const vv = uni.createVideoContext('ivideo', this)  
    vv.pause()  
    console.log('pause...')  
    },  
    play() {  
    const vv = uni.createVideoContext('ivideo', this)  
    vv.play()  
    console.log('play...')  
    },  
}  
}  
</script>
2021-04-29 22:55 负责人:DCloud_UNI_LXH 分享
已邀请:
黑子

黑子 (作者)

将代码更改为这样可以实现正常功能
比如:
const vv = uni.createVideoContext('ivideo', this)
vv.pause() 暂停无效

更改为
this.$refs.ivideo.pause() //暂停有效

请uniapp工程师修复一下哦
console.log('pause...')

  • 黑子 (作者)

    video上 ID和ref都叫ivideo

    <video id="ivideo" ref="ivideo"

    2021-04-30 00:09

  • DCloud_UNI_LXH

    回复 黑子: 提供可复现,可直接运行的项目示例

    2023-01-16 17:27

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