Question

我正在我的一个屏幕中实现 Track Player，但是当我尝试渲染它时，出现“无法启动应用程序/本机模块无法打开 Null”错误。我的最终目标是在此页面上实现 2 首曲目，包括播放和暂停功能以及艺术作品。我清除了缓存并重新启动了我的模拟器，甚至在网络浏览器中运行了它

这是我的代码：

import Icon from 'react-native-ionicons'
import TrackPlayer from 'react-native-track-player';
import { ScrollView, StyleSheet, Text, View, TouchableOpacity } from 'react-native';i
import { SafeAreaProvider } from 'react-native-safe-area-context';



const tracks = [
    {
        id: 1,
        url: require("../assets/tracks/Podcast95 .mp3"),
        title: 'Episode95',
    },
    {
        id: 2,
        url: require('../assets/tracks/Podcast100.mp3'),
        title: 'Episode100',
    },
];

TrackPlayer.updateOptions({
    stopWithApp: false,
    capabilities: [TrackPlayer.CAPABILITY_PLAY, TrackPlayer.CAPABILITY_PAUSE],
    compactCapabilities: [
        TrackPlayer.CAPABILITY_PLAY,
        TrackPlayer.CAPABILITY_PAUSE,
    ],
});


const Episode = ({navigation}) => {
  const setUpTrackPlayer = async () => {
    try {
      await TrackPlayer.setupPlayer();
      await TrackPlayer.add(tracks);
      console.log('Tracks added');
    } catch (e) {
      console.log(e);
    }
  };

  useEffect(() => {
    setUpTrackPlayer();

    return () => TrackPlayer.destroy();
  }, []);

    
    
    return (
        <SafeAreaProvider style={styles.container}>
            <ScrollView style={styles.mainContainer}>
                <View>
                    <Image
                     style={styles.artworkImg}
                     source={require('../assets/JColeSlam.jpg')} />
                    <TouchableOpacity
                      onPress={() => TrackPlayer.play(id,1 )}>
                        <Ionicons name="play" size={30} color="#777777" />
                    </TouchableOpacity>
                    <TouchableOpacity>
                        <Ionicons name="pause" size={30} color="#777777" />
                    </TouchableOpacity>
                </View>
            </ScrollView>
        </SafeAreaProvider>
      
    );
}; 

const styles = StyleSheet.create ({
    
    container: {
        flex: 1,
        backgroundColor: '#222831'
    },
    mainContainer: {
        flex: 1,
        alignItems: 'center',
        justifyContent: 'center'
    },
    artworkImg: {
        width: '100%',
        height: '100%',
        borderRadius: 15,
    }
})


export default Episode; ```

Answer 1

运行 npm install 它可以为你工作并检查是否安装了第三方依赖项

无法启动应用程序/本机模块无法打开 Null

1 个答案: