Topic PK Component
Updated: 2024-04-22 19:18:32
This component is primarily used to display topic PK content initiated by backend administrators.
Before introducing and using this functional component, you need to perform public configuration for the interactive function receiving SDK. For details, please refer to: Interactive Function Receiving UI Component - SDK Configuration.
Introduction
Online File Import Method
// 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 Method (Recommended)
// PC 端
import Topic from '@polyv/interactions-receive-sdk-ui-default/lib/PcTopic';
// 移动端
import Topic from '@polyv/interactions-receive-sdk-ui-default/lib/MobileTopic';
Code Example
Taking PC integration as an example:
<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
| Attribute | Type | Default Value | Description |
|---|---|---|---|
| lang | string: 'zh_CN', 'en' | 'zh_CN' |
Language |
| topic-sdk | Object | null | Topic SDK instance |
