Home > Article > Web Front-end > How to use audio components in WeChat mini programs
This article mainly introduces the function of using the audio component of the WeChat applet to play music, and analyzes the operation skills related to the audio component of the WeChat applet to play online music in the form of examples. It also comes with source code for readers to download and refer to. Friends who need it can refer to it.
The example in this article describes the WeChat applet's use of the audio component to play music. Share it with everyone for your reference, as follows:
Key code
① index.wxml
<audio src="{{audioSrc}}" poster="{{audioPoster}}" name="{{audioName}}" author="{{audioAuthor}}" controls></audio>② index.js
Page({
data: {
audioPoster: 'http://y.gtimg.cn/music/photo_new/T002R300x300M000003rsKF44GyaSk.jpg?max_age=2592000',
audioName: '此时此刻',
audioAuthor: '许巍',
audioSrc: 'http://ws.stream.qqmusic.qq.com/M500001VfvsJ21xFqb.mp3?guid=ffffffff82def4af4b12b3cd9337d5e7&uin=346897220&vkey=6292F51E1E384E06DCBDC9AB7C49FD713D632D313AC4858BACB8DDD29067D3C601481D36E62053BF8DFEAF74C0A5CCFADD6471160CAF3E6A&fromtag=46',
}
})The above is what I compiled for everyone. I hope it will be helpful to everyone in the future.
Related articles:
About this pointing problem in vue (detailed tutorial)
How to implement JSON data grouping optimization in Javascript
How to use axios to upload pictures with a progress bar function
How to use the Validate plug-in in jQuery
How to use js cookies to implement the shopping cart function
Detailed interpretation of the new features of Angular5.1
How to use vuex to implement menu management
How to use Vue to develop tree components
How to use Vue to develop a Sudoku game
Details Interpretation of webpack3 compilation compatible with IE8 (detailed tutorial)
How to implement the rename file function using node
How to convert bool value in js?
How to use refs positioning in vue
The above is the detailed content of How to use audio components in WeChat mini programs. For more information, please follow other related articles on the PHP Chinese website!