资产音频文件无法在世博会中播放

Question

import AlphService from './AlphService';
export default class MyClass extends React.Component {
 alphService;
 constructor(props) {
  super(props);
  alphService = new AlphService();
  this.state = alphService.getState();
 }
 componentWillMount() {
    this.play(this.state.sound);
  }
  play(source) {
   console.log(source);
   Audio.setIsEnabledAsync(true);
   const sound = new Audio.Sound();
   const play_sound = (async () => {
    await sound.loadAsync(require(source)); //Error Here
    await sound.playAsync();
   })();
  }
}

阿尔夫服务.js

export default class alphService {
 stateObj = {
  sound: ""
 };
 getState(){
  this.stateObj.sound = "../assets/sounds/c.mp3"; 
  return this.stateObj;
 }
}

错误：组件/字母.js：第 51 行的调用无效：要求（源）

并尝试我从getState()方法返回require(soundPathVar)对象并从play()中删除所需的对象，然后是相同的错误。

我是 react-native 的初学者，我想尝试创建一个动态声音文件路径。所以如果我做错了，你能帮帮我吗？提前谢谢。

Answer 1

当我

尝试require动态图像时，我遇到了这个问题，事实证明，即使require("SOURCE/" + "something.png")不起作用，require也只接受特定的来源，它应该是require("SOURCE/something.png")的。试试这个：

export default class alphService {
 stateObj = {
  sound: ""
 };
 getState(){
  this.stateObj.sound = require("../assets/sounds/c.mp3"); 
  return this.stateObj;
 }
}

您可以创建一个包含所有路径的 json 文件并像这样使用它：

export default const paths = {
    file1: require("path/to/file1.png"),
    file2: require("path/to/file2.png")
}

然后在组件中导入此路径文件并像这样使用它（例如图像）：

<Image source={paths.file1}/>