非捕捉（プロミス内）DOMExceptionエラー

最近、私のプロジェクトにビデオの自動再生を追加したのですが、時々エラー（RT）が報告され、自動再生されないことがあります。

<video
	id="videoPlayer"
	v-show="!isNormalCamera"
	class="preview-video"
	name="media"
	controls="controls"
	autoplay="autoplay"
	loop
>
	<source :src="videoSrc" type="video/mp4">
</video>

それから調べたら、Chromeは自動再生を無効にすると書いてありました。  https://developers.google.com/web/updates/2017/09/autoplay-policy-changes  . すると、中に解決策があり、そのコードは以下の通りです。

var promise = document.querySelector('video').play();

if (promise ! == undefined) {
     promise.then(_ => {
     // Autoplay started!
 }).catch(error => {
    // Autoplay was prevented.
    // Show a "Play" button so that user can start playback.
  });
}

これを書いてみると、問題は解決していないことがわかりました。そして、別の解決策を見つけた後、私は  muted="muted" すると、問題は解決した。

<video
	id="videoPlayer"
	v-show="!isNormalCamera"
	class="preview-video"
	name="media"
	muted="muted"
	controls="controls"
	autoplay="autoplay"
	loop
>
	<source :src="videoSrc" type="video/mp4">
</video>