React Native: Использование реквизита в const

Question

Я новичок, чтобы отреагировать/отреагировать на родной язык и попытаться создать простое приложение, которое воспроизводит локальный MP3. Я использую модуль response-native-sound, который, кажется, работает очень хорошо.

Хотя сейчас, я пытаюсь передать fileName в качестве реквизита из моей категории в компонент игрока. Кажется, что этот звук-native-sound требует предварительной загрузки звукового файла. Таким образом, теперь я получаю следующее сообщение об ошибке:

"Unhandled JS Exception: Cannot read property 'fileName' of undefined".

...  
import Sound from 'react-native-sound'; 

const play = new Sound(this.props.fileName, Sound.MAIN_BUNDLE, (error) => { 
    if (error) { 
    console.log('failed to load the sound', error); 
    } else { // loaded successfully 
    console.log('duration in seconds: ' + play.getDuration() + 
     'number of channels: ' + play.getNumberOfChannels()); 
    } 
}); 

export default class playTrack extends Component { 
    constructor(props) { 
     super(props); 
     this.state = { 
     playing: false, 
     track: this.props.fileName, 
     }; 
    } 

    playTrack() { 
     this.setState({playing: true}) 
     play.play((success) => { 
     if (success) { 
      console.log('successfully finished playing'); 
     } else { 
      console.log('playback failed due to audio decoding errors'); 
     } 
     }) 
    } 
... 

Есть ли у вас какие-либо указатели для меня, как идти об этом?

Answer 1

У вас нет доступа к вашему экземпляру класса this вне класса, как вы его пытаетесь использовать. Вместо этого создайте Sound в конструкторе:

import Sound from 'react-native-sound'; 

export default class playTrack extends Component { 
    constructor(props) { 
     super(props); 

     this.play = new Sound(props.fileName, Sound.MAIN_BUNDLE, (error) = > { 
      if (error) { 
       console.log('failed to load the sound', error); 
      } else { // loaded successfully 
       console.log('duration in seconds: ' + this.play.getDuration() + 
        'number of channels: ' + this.play.getNumberOfChannels()); 
      } 
     }); 

     this.state = { 
      playing: false, 
      track: this.props.fileName, 
     }; 
    } 

    playTrack() { 
     this.setState({ 
      playing: true 
     }) 
     this.play.play((success) = > { 
      if (success) { 
       console.log('successfully finished playing'); 
      } else { 
       console.log('playback failed due to audio decoding errors'); 
      } 
     }) 
    }