React: 再生ボタンを押すと音楽が流れるようにしたい

インストール

yarn add @material-ui/core
yarn add @material-ui/icons
yarn add react-sound

使用例

import React, { Component } from 'react';
import IconButton from '@material-ui/core/IconButton';
import PlayArrowIcon from '@material-ui/icons/PlayArrow';
import Sound from 'react-sound';

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {
      status: Sound.status.STOPPED,
    }
  }
  render() {
    return (
      <div>
        <Sound url="[サウンドファイル]" playStatus={this.state.status} />
        <IconButton aria-label="Play/pause" onClick={()=>{this.setState({ status: Sound.status.PLAYING })}}>
	  <PlayArrowIcon />
        </IconButton>
      </div>
    );
  }
}

こんな感じでしょうか。

コメントする

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です