英文:
Bind "src" attiribute in audio tag within vue code
问题
尝试绑定音频标签的 src 属性在 Vue 代码中,但不起作用..
请注意,对象 (surah) 是 API 返回的 JSON 对象..
这是我的代码 :
<audio controls class="audio">
<source :src="'@/data/mp3/' + surah.source" type="audio/mpeg">
<p>عفوًا متصفحك لا يدعم تشغيل الأصوات، قم بتحديثه أو استخدم متصفح آخر.</p>
</audio>
其余的代码可以正常工作(使用 API),只有这部分有问题..
英文:
try to bind src of audio tag invue code bur does not work ..
Note that object (surah) is api json object ..
this is my code :
<audio controls class="audio">
<source :src="'@/data/mp3/' + surah.source" type="audio/mpeg">
<p>عفوًا متصفحك لا يدعم تشغيل الأصوات، قم بتحديثه أو استخدم متصفح آخر.</p>
</audio>
rest of code work will (use api) except for this ..
答案1
得分: 0
1. 确保 surah 对象在组件的数据中可用。
2. 确保 mp3 文件存储在 data/mp3 文件夹中。
3. 确保 surah 对象的 source 属性是一个有效的字符串,表示 mp3 文件的名称(例如:file_audio.mp3)。
4. 尝试以下示例:
模板:
<audio controls class="audio">
<source :src="`@/data/mp3/${surah.source}`" type="audio/mpeg">
<p>عفوًا متصفحك لا يدعم تشغيل الأصوات، قم بتحديثه أو استخدم متصفح آخر.</p>
</audio>
脚本:
export default {
data() {
return {
surah: {
name: 'يونس',
Number: 10,
'Number of Verses': 109,
'Makki/Madani': 'مكية',
Theme: 'قصص الأنبياء',
source: '010.mp3',
},
}
}
}
英文:
- Make sure the surah object is available in component's data
- Make sure if the mp3 files are stored in a data/mp3 folder
- Make sure the source property of surah object is a valid string that represents the name of mp3 file (Ex: file_audio.mp3)
- Try this example:
Template:
<audio controls class="audio">
<source :src="`@/data/mp3/${surah.source}`" type="audio/mpeg">
<p>عفوًا متصفحك لا يدعم تشغيل الأصوات، قم بتحديثه أو استخدم متصفح آخر.</p>
</audio>
Script:
export default {
data() {
return {
surah: {
name: 'يونس',
Number: 10,
'Number of Verses': 109,
'Makki/Madani': 'مكية',
Theme: 'قصص الأنبياء',
source: '010.mp3',
},
}
}
}
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论