Mpvue applet live component use

The official story

{
  "subpackages": [{"root": "packageA"."pages": [
        "pages/home/home"]."plugins": {
        "live-player-plugin": {
          "version": "1.0.0".// Enter the latest version number of the livestreaming component. The latest version number can be obtained during debugging of the wechat developer tool
          "provider": "wxxxxxxxxxxxxx" // The value must be the appID of the livestreaming component}}}]}Copy the code

How does MPVue introduce live components

// mpvue app.json file; Introduced the 'live-player-plugin' live component code package
{
  "pages": [
    "pages/index/main", · · · · · ·],"subPackages":[
    {
        "root":"pages/staff/"."pages": ["employee/main",]}],"plugins": {
    "live-player-plugin": {
      "version": "1.0.1"."provider": "wxxxxxxxxxxxxx"}},Copy the code

How to use the live component in MPVue

<! -- Jump to the live component page from the vue file through the navigator (add a little style to the page link) -->
<template>
  <div class="live">
    <navigator url="plugin-private://wx2b03c6e6xxxxxxxx/pages/live-player-plugin? Room_id =[live room ID]">The broadcast room page is displayed</navigator>
    </div>
</template>
Copy the code

Q&A

1. How to view live broadcast componentslive-player-pluginLatest version number

The latest version number can be obtained during debugging of the wechat developer tool mentioned in the notes of the official document means that the basic information menu can be called up by the “Details” button on the toolbar of the wechat Developer tool, and the latest version number can be seen in the plug-in information item of the menu, and the latest version number can be entered into the configuration information

2. Subscription componentsubscribeIntroduce error and display 2s disappear automatically after successful introduction

The official example is to put live components into subcontractor plugins, and copy the plugins configuration to the outermost layer of the app.json file (the same as pages). The subscription component is always displayed only when the live broadcast is not started. Once in the live broadcast, over, expired and other states will be automatically hidden.