Reactjs - невозможно объединить переменные в источнике звука - PullRequest
Новая
       108

Reactjs - невозможно объединить переменные в источнике звука

1 голос
/ 02 августа 2020

Я динамически создаю источник звука по дате и пути.

Вот мой рабочий код: 

var cdrdata2 =  this.props.cdrdata.map((data,index)=>{
 return(
   <tr key = {index} style={{display:'table',width:'100%',backgroundColor:'white'}}>
    <td width = "11.3%" >{`${data.startDate}`}</td> //12-09-2020
    <td width = "9.4%">{`${data.cdr_recording_file_path}`} // monitor/auto-1589470814-367-7865290090.wav
    <button onClick={this.playAudio}>
      <span>Play</span>
    </button>
    <audio className="audio-element">
      <source src="http://localhost/cdr/phone_cdr/`${data.startDate}`}/{`${data.cdr_recording_file_path}`}"></source>
    </audio>
    </td>
  </tr>  
    
 )

Ожидаемый результат: 

http://localhost/cdr/phone_cdr/12-09-2020/monitor/auto-1589470814-367-7865290090.wav

Фактический результат: 

http://localhost/cdr/phone_cdr/%60$%7Bdata.startDate%7D%60%7D/%7B%60$%7Bdata.cdr_recording_file_path%7D%60%7D 404 (Not Found)

Кто-нибудь может меня поправить? Заранее спасибо.

1 Ответ

0 голосов
/ 02 августа 2020

Вы неправильно используете литералы шаблона. Правильная форма будет: 

<source src={`http://localhost/cdr/phone_cdr/${data.startDate}/${data.cdr_recording_file_path}`}></source>
...