search

metowolf / MetingJS

:cake: A powerful plugin connect APlayer and Meting
https://i-meto.com/about/
MIT License
1.17k stars 158 forks source link

如何在使用 Meting 后使用 APlayer 的 API #32

Open LiarOnce opened 4 years ago

LiarOnce commented 4 years ago

使用 APlayer 提供的范例引用的话会无法加载。

wertasy commented 4 years ago

像这样：document.querySelector('meting-js').aplayer.play();

LiarOnce commented 4 years ago

@wertasy 感谢回复，但因为兼容性原因只能使用 1.2.0，如果是 1.2.0 的请问应该怎样使用？

lim8639 commented 3 years ago

直接改Metingjs，把设置传进去

scillidan commented 3 years ago

aplayer的部分照旧使用。这样写 html部分

<div id="aplayer1"></div>
<div id="aplayer2"></div>
…

js部分

const ap1 = new APlayer({
    container: document.getElementById('aplayer1'),
    autoplay: false,
    preload: 'none',
    listFolded: true,
    audio: [{
        name: '',
        artist: '',
        url: '',
        cover: '.webp',
        theme: '#baa087',
    }, {
       …
    }]
});

metingjs的部分，在html这样写

<div class="aplayer" data-id="1292139283" data-server="xiami" data-type="playlist" data-list-folded="true" data-preload="none" data-audio-cover=".webp">
lp516357752 commented 3 years ago

提供一种个人可用的Vue版本的解决方法 `export default { name: "MusicPlayer", components: {

}, data() { return { player: null } },

mounted() { this.$refs.player.addEventListener("DOMNodeInserted", this.getPlayer) }, methods: { getPlayer(e) { //重点所在 this.$nextTick( () =>{ this.player = this.$refs.player.aplayer;//this.$refs.player就是meting标签元素 this.player.setMode("normal"); }) this.$refs.player.removeEventListener("DOMNodeInserted", this.getPlayer) } } }`