- 当前 Bug 的表现(可附上截图)
页面渲染多的video标签后,视频自动播放(未设置autoplay属性),时间轴在动,但是画面未播放,还是未播放状态.
- 预期表现
视频不自动播放
- 复现路径
数据量多的情况下出现上述Bug, Demo中列举了数据模型 ,可增量扩展数据量测试.
- 提供一个最简复现 Demo
HTML
<section v-for="(item,index) of dataArr" :key=“index”>
<!-- 视频 -->
<section v-if=“item.type==‘video’” class=“videoStyleOrder”>
<video controls :src=“item.content” :poster=“item.poster”></video>
</section>
</section>
data() {
return {
dataArr:[],
getNodes:[{
name:‘z1’,
type:‘text’,
content:‘123’
},
{
name:‘z1’,
type:‘video’,
content:‘weixin.qq.com/a.mp4’
},
{
name:‘z2’,
type:‘text’,
content:‘123’
},
{
name:‘z1’,
type:‘text’,
content:‘123’
},
{
name:‘z1’,
type:‘video’,
content:‘weixin.qq.com/b.mp4’
},
.
.
.
{
name:‘z1’,
type:‘video’,
content:‘weixin.qq.com/c.mp4’
},
]
};
}
onLoad(){
let _this = this;
let _nodesInit = this.getNodes;
_nodesInit.forEach(element => {
if (element.name&&element.name==‘z1’) {
_this.dataArr.push(
{
type:element.type,
content:element.content
}
)
}
});
}