1.第一次使用[muted]="true"加载可以实现首次静音,跳转路由之后我动态设置了清除对应的block.src和block.type,然后重新跳转到这个页面时他再次选中视频则无法静音播放,但是会自动播放,

并且无论是页面中点击清除了这个video还是跳转路由,都会导致之后无法 静音播放

      @switch (block.type) {
      @case ('image') {
      <img [src]="block.src" style="width:100%;height:100%;object-fit:cover;">
      }
      @case ('video') {
      <video autoplay loop muted="true" [src]="block.src"
             (loadeddata)="onVideoLoaded()"
             style="width:100%;height:100%;object-fit:cover;pointer-events: none;aspectRatio: '16/9'"></video>
      }
      }

 2.之后尝试使用   (loadeddata)="onVideoLoaded()"    方法,在资源加载的时候给他默认加上静音,但是依然没有效果,但是这个方法确实执行了,不理解为什么,并且浏览器检查的时候虽然执行了方法,但是并没有加上muted元素,

最终实现效果,简单朴素的DOM方法
        const videos = document.getElementsByTagName('video')
        Array.from(videos).forEach((video) => {
            video.muted = true;
        })

Logo

腾讯云面向开发者汇聚海量精品云计算使用和开发经验,营造开放的云计算技术生态圈。

更多推荐