APlayer 播放列表管理与配置

播放列表何时出现

当你给 APlayer 的 audio 参数传入数组（而不是单个对象）时，播放器会自动生成一个播放列表。传入单个对象时，列表不出现。

列表的三个配置参数

初始化示例

const ap = new APlayer({
    container: document.getElementById('aplayer'),
    listFolded: false,       // 列表默认展开
    listMaxHeight: 200,      // 列表最高 200px，超出滚动
    audio: [
        { name: '歌曲一', artist: '艺术家A', url: '1.mp3', cover: '1.jpg' },
        { name: '歌曲二', artist: '艺术家B', url: '2.mp3', cover: '2.jpg' },
        { name: '歌曲三', artist: '艺术家C', url: '3.mp3', cover: '3.jpg' }
    ]
});

列表的 API 控制

APlayer 提供了一组 API 来程序化地管理播放列表。

添加音频

// 添加单个
ap.list.add({
    name: '新歌曲',
    artist: '新艺术家',
    url: 'new.mp3',
    cover: 'new.jpg',
    lrc: 'lrc.lrc',
    theme: '#333'
});

// 批量添加
ap.list.add([
    { name: '歌曲A', artist: 'A', url: 'a.mp3', cover: 'a.jpg' },
    { name: '歌曲B', artist: 'B', url: 'b.mp3', cover: 'b.jpg' }
]);

移除音频

// 按下标移除（从 0 开始）
ap.list.remove(1);    // 移除第二首

切换当前播放

// 切到指定下标的歌曲
ap.list.switch(2);    // 切到第三首

清空列表

ap.list.clear();

显示 / 隐藏列表

ap.list.show();      // 强制显示
ap.list.hide();      // 强制隐藏
ap.list.toggle();    // 切换

列表相关事件

绑定事件来响应列表的动态变化：

ap.on('listadd', function(audio) {
    console.log('添加了音频', audio);
});

ap.on('listremove', function(audio) {
    console.log('移除了音频', audio);
});

ap.on('listswitch', function(index) {
    console.log('切换到第', index, '首');
});

ap.on('listclear', function() {
    console.log('列表已清空');
});

ap.on('listshow', function() {
    console.log('列表展开');
});

ap.on('listhide', function() {
    console.log('列表折叠');
});

迷你模式下的列表

注意：迷你模式（mini: true）下即使传入多音频也不会显示列表。歌曲只能通过上一首 / 下一首按钮或 API 切换。如果需要列表可见，保持 mini: false。