1、在配置文件中插入微信小程序的插件代码,如下图:
2、页面代码如下,可以直接复制进去用:
<template>
<view class="content">
<button @click="getLiveList">获取直播列表</button>
<navigator v-for="item,index in liveList"
:url="'plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=' + item.room_id">
<view class="liveRoom">
<text>{{item.name}}</text>
<image :src="item.share_img"></image>
</view>
</navigator>
</view>
</template>
<script>
export default {
data() {
return {
liveList:[]
}
},
methods: {
getLiveList: function () {
console.log("获取直播间列表");
var params = {page: 1};
uni.request({
url: "这里是你的后台接口地址",
data: params,
success: (res) => {
console.log(res.data.data);
this.liveList=res.data.data;
}
});
}
}
}
</script>
样式自己按需求写,后台接口请找后端工程师实现,页面截图如下: