小编Aus*_*cus的帖子

反应键盘事件不触发

我有一个简单的React组件,该组件应通过keyDown上的Web Audio API播放音频,并停止keyUp上的音频。我有一个JSFiddle,它显示了我在localhost上看到的相同行为。这是内联代码:

var Keyboard = React.createClass({
  componentDidMount: function () {
    var context = new (window.AudioContext || window.webkitAudioContext)();
    var oscillator = context.createOscillator();
    var gain = context.createGain();

    oscillator.type = 'sine';
    oscillator.frequency.value = 3000;
    gain.gain.value = 0.5;

    oscillator.connect(gain);
    gain.connect(context.destination);

    this.setState({
      context: context,
      oscillator: oscillator,
      gain: gain
    });
  },

  render: function() {
    return (
      <div id="keyboard"
           onKeyDown={this.playNote}
           onKeyUp={this.stopNote}>
      </div>
    );
  },

  playNote: function (ev) {
    console.log('play');
    this.state.oscillator.start();
  },

  stopNote: function (ev) {
    console.log('stop');
    this.state.oscillator.stop();
  }
});

React.render(<Keyboard />, document.getElementById('container'));
Run Code Online (Sandbox Code Playgroud)

即使没有Web Audio的东西,我也无法显示日志语句。我已经阅读了React …

javascript frontend web reactjs

2
推荐指数
2
解决办法
4840
查看次数

标签 统计

frontend ×1

javascript ×1

reactjs ×1

web ×1