話題PK元件

本元件主要用於顯示後台管理員發起的話題PK內容。

在引入及使用本功能元件前，需要先對互動功能接收端SDK進行公共配置，詳情請查看：互動功能接收端 UI 元件 - 配置 SDK。

引入

線上檔案引入方式

// script 标签引入，根据版本号引入JS版本。
<script src="https://websdk.videocc.net/interactions-receive-sdk-ui-default/0.24.0/lib/PcTopic/PcTopic.umd.min.js"></script>
// PC端
<script>
    const Topic = window.PolyvIRScene.PcTopic.default;
</script>

// script 标签引入，根据版本号引入JS版本。
<script src="https://websdk.videocc.net/interactions-receive-sdk-ui-default/0.24.0/lib/MobileTopic/MobileTopic.umd.min.js"></script>
// 移动端
<script>
    const Topic = window.PolyvIRScene.MobileTopic.default;
</script>

import 方式引入（推薦）

// PC 端
import Topic from '@polyv/interactions-receive-sdk-ui-default/lib/PcTopic';

// 移动端
import Topic from '@polyv/interactions-receive-sdk-ui-default/lib/MobileTopic';

程式碼範例

以 PC 端接入為例：

<template>
  <div>
    <Topic
        :lang="lang"
        :topic-sdk="topicSdk"
    />
  </div>
</template>

<script>
import { Topic as TopicSdk} from '@polyv/interactions-receive-sdk';
import Topic from '@polyv/interactions-receive-sdk-ui-default/lib/PcTopic';

export default {
  components: {
    Topic,
  },

  data() {
    return {
      // 话题SDK实例
      topicSdk: null,
    };
  },

  created() {
    this.topicSdk = new TopicSdk();
  },

  beforeDestroy() {
    this.topicSdk?.destroy();
  },
};
</script>

Attributes