vue实战精华(二)——模版字符串 / 音频路径预加载

1.提出问题

最近有一个新需求，第一，播放音频前先把它的音频路径src预加载；第二，点击播放按钮时实现连续播放，一首播完接着第二首播放。

2.解决思路

第一个需求里面有两种方法，一是在页面结构上写六个audio标签(它的id不同)，然后让他们的路径循环，再逐个播放；二是写一个audio标签，让它渲染出六个audio并带上不同的src路径(这里考虑到如果是id的话，每个audio应是不同的！)，通过控制不同id的audio让其一个个播放。

• 技术点：让渲染出来的audio的id成为 audio1、audio2、audio3、audio4等等的形式，这里使用模版字符串

3.模版字符串

ES6中的语法：用反引号(`)标识，它可以当作普通字符串使用，也可以用来定义多行字符串，或者在字符串中嵌入变量。ES6中的模版字符串很好的解决了ES5在字符串功能上的一些限制。

• 基本的字符串格式化：将表达式嵌入字符串中拼接，用${}来界定

ES5中：
     var  player = 'String'
     console.log('ES5:'+ way)
ES6中：
     let way = 'String Template'
     console.log(`ES6:${way}`)

• 多行字符串拼接：ES5