реагировать на проблему при установке тегов видео srcObject - PullRequest
0 голосов
/ 24 сентября 2018

Я пытаюсь установить src видео на камеру моего ноутбука.Таким образом, но я получаю эту странную ошибку.хотя я получаю эту ошибку, код работает нормально.Я не могу найти много информации по этому вопросу.Я был бы признателен за указание в правильном направлении или помощь в решении.

index.js:2178 Warning: Unexpected ref object provided for video. Use either a ref-setter function or React.createRef().
in video (at App.jsx:34)
in div (at App.jsx:33)
in App (at src/index.js:6)

Ниже, вы найдете мой файл App.jsx.

import React, {Component} from 'react';
class App extends Component {
    state = {
        start: false,
        stream: false
    }
    setOutGoingVideoStream = (node) => {
        this.setOutGoingVideoStream = node
    }
    start = (e) => {    
      navigator.mediaDevices
        .getUserMedia({
          audio: true,
          video: true,
        })
        .then((stream) => {
            console.log("Starting stream")
            this.setOutGoingVideoStream.srcObject = stream;
            this.setState({start: true, stream})
        })
        .catch(e => alert(`getUserMedia() error: ${e.name}`));
    }
    hangup = () => {
      console.log('Ending call');
      this.state.stream.getTracks()[0].stop();
      this.state.stream.getVideoTracks()[0].stop();
      this.setState({start: false, stream: false})
    }
    render() {
        return (
            <div>
                <video
                    ref={this.setOutGoingVideoStream}
                    playsInline
                    autoPlay
                    muted
                />
                <button
                    onClick = {this.start}
                    disabled = {this.state.start}
                >
                    request permission
                </button>
                <button

                >
                    call
                </button>
                <button
                    onClick={this.hangup}
                    disabled={!this.state.start}
                >
                    hang up
                </button>
            </div>
        )
    }
}

export default App;
...