互动功能发起端 UI 组件

概述

本项目是保利威直播互动功能发起端（开播端及管理端等）的 UI 组件，基于 Vue.js 2.6.x 编写，开发人员可以直接使用本组件或基于本组件进行二次开发。

如果您使用的是 React、Angular 等其他框架，可以参照本组件源代码和 SDK 文档自行实现对应的界面。

注意，部分功能在 UI 设计稿中是以模态框（Modal）形式呈现的，但本组件仅提供主体内容部分，请自行实现外层模态框（或以其他形式展现），并根据对应组件的事件去控制可见性。

使用文档

安装

npm i @polyv/interactions-launch-sdk @polyv/interactions-launch-sdk-ui-default

引入 SDK 与组件

// 引入 @polyv/interactions-launch-sdk
import * as InteractionsLaunchSDK from '@polyv/interactions-launch-sdk';
// 按需引入组件
import CheckIn from '@polyv/interactions-launch-sdk-ui-default/lib/CheckIn';
import AnswerCard from '@polyv/interactions-launch-sdk-ui-default/lib/AnswerCard';
import Timer from '@polyv/interactions-launch-sdk-ui-default/lib/Timer';

引入其他依赖

互动功能发起端 UI 组件依赖于 Element UI (2.x) 的部分组件，可以选择完整引入或按需引入 Element UI。

以下是按需引入时需要在 main.js 中增加的内容：

// 使用签到组件、抽奖组件时，需要额外引入 element-ui 的 DatePicker 组件。
import { DatePicker } from 'element-ui';
// 使用抽奖组件时，需要额外引入 element-ui 的 button 样式文件。
import 'element-ui/lib/theme-chalk/button.css';

// 注册组件
Vue.use(DatePicker);

配置 SDK

请参考互动功能发起端 SDK中的「使用说明」。

在 SDK 初始化完毕后，再加载组件。

组件

此处仅提供各功能参考文档链接。

• AnswerCard 答题卡：参考文档

• CheckIn 签到：参考文档

• Timer 计时器：参考文档

• Lottery 抽奖：参考文档

• Notice 公告：参考文档

• Questionnaire 问卷：参考文档

• RunAnswer 抢答：参考文档

版本更新

暂无