reactjs 如何在加载React.js页面时使用useSound设置固定音量?

l3zydbqr  于 2023-01-17  发布在  React
关注(0)|答案(1)|浏览(138)

我的代码:

import React from 'react';
 import useSound from 'use-sound';
 import music from '../audio/cny music.mp3';

 const Audio = () => {
 const [play] = useSound(music,{ volume:0.2  });
 return (
     <audio onload={ play}></audio>
   );      
 };

 export default Audio

我的音频在加载页面时播放,然而,音量仍然是最大的,即使我设置为0. 2。我错过了什么吗?

z31licg0

z31licg01#

试试这个:

import { useState, useEffect } from 'react';
import useSound from 'use-sound';

const MyComponent = () => {
  const [play, { stop }] = useSound('path/to/audio.mp3', { volume: 0.2 });

  useEffect(() => {
    play();
  }, []);

  return (
    // your component's JSX
  );
}

您还可以在播放声音后使用由useSound挂接返回的stop函数来调整音量,该函数允许您停止声音并对其应用新选项,包括音量。

stop();
play({ volume: newVolume });

相关问题