Этот вопрос состоит из двух частей: объяснение текущего примера кода, который я нашел, чтобы использовать response-native-sound, и преобразование его в Hook. Я пытаюсь понять, как this.sound работает без определения его в состоянии класса или где:
import Sound from 'react-native-sound'
class VoicemailItem extends React.PureComponent {
constructor () {
super()
this.state = {
isExpand: false,
read: false,
error: null,
playState: 'paused', // playing, paused
playSeconds: 0,
duration: 0,
useEarPiece: false
}
this.sliderEditing = false
}
play = async () => {
if (this.sound) {
this.sound.play(this.playComplete)
this.setState({playState: 'playing'})
} else {
const { id, userCredential, contentUrl } = this.props
const voiceMailURL = `${contentUrl}/content/voicemail/get?msgId=${id}&token=${userCredential.access_token}`
this.sound = new Sound(voiceMailURL, Sound.MAIN_BUNDLE, (error) => {
if (error) {
Alert.alert('Notice', 'audio file error. (Error code : 1)')
this.setState({playState: 'paused'})
} else {
this.setState({playState: 'playing', duration: this.sound.getDuration()})
// this.state.useEarPiece ? this.sound.setSpeakerphoneOn(true) : this.sound.setSpeakerphoneOn(false)
this.sound.setSpeakerphoneOn(false)
this.sound.play(this.playComplete)
}
})
}
}
, если вы загляните внутрь play , код почему-то знает, что this.sound является экземпляром звука? Возможно, я не совсем понимаю это в JS.
Этот код работает, но мне нужно преобразовать его в дружественный синтаксис Hook и TypeScript, и это моя попытка:
let voicemailFile = useRef();
console.log('voicemailFile', voicemailFile)
const playVoicemail = useCallback<() => void>(
async () => {
if (voicemailFile) {
voicemailFile.play(playComplete);
setPlayState('play')
} else {
// actual file:
// const { id, userCredential, contentUrl } = this.props
// const voiceMailURL = `${contentUrl}/content/voicemail/get?msgId=${id}&token=${userCredential.access_token}`
voicemailFile = new Sound('test.mp3', Sound.MAIN_BUNDLE, (error) => {
if (error) {
console.log('failed to load the sound', error);
return;
}
})
}
}, []
);
Я думал использовать useRef () для хранения значения voicemailFile В моем текстовом редакторе voicemailFile внутри оператора else становится подчеркнутым красным, «Звук нельзя назначить типу MutableRefObject».
Я не уверен, как решить эту проблему, не имея состояния класса.