questionnaire 問卷

一、介紹

問卷元件用於直播間的問卷調查功能，支援多種題型包括單選題、多選題、問答題、評星題等。元件提供完整的問卷展示、答題和提交功能。

元件提供一個主要入口元件：

• NormalQuestionnaire - 通用問卷元件

二、引入

2.1 UMD 方式

<script src="https://websdk.videocc.net/iar-questionnaire-ui/rc-20250612/normal-questionnaire.umd.js"></script>

<script>
const { NormalQuestionnaire } = window.PolyvIarQuestionnaireUi;
</script>

2.2 NPM 方式

// 安装依赖
pnpm add @polyv/iar-questionnaire-ui

// 引入组件
import { NormalQuestionnaire } from '@polyv/iar-questionnaire-ui';

三、程式碼範例

<template>
  <div>
    <!-- 问卷组件 -->
    <NormalQuestionnaire
      ref="questionnaireRef"
      :questionnaire-target="questionnaireSDK"
      :questionnaire-data="questionnaireData"
      @to-show="onToShow"
      @to-hide="onToHide"
      @submit-success="onSubmitSuccess"
    />
  </div>
</template>

<script setup>
import { NormalQuestionnaire } from '@polyv/iar-questionnaire-ui';
import { Questionnaire } from '@polyv/iar-questionnaire-sdk';

// 初始化问卷 SDK
const questionnaireSDK = new Questionnaire(iarCore);

// 问卷数据
const questionnaireData = ref(null);

// 事件处理
const onToShow = () => {
  console.log('显示问卷弹窗');
};

const onToHide = () => {
  console.log('隐藏问卷弹窗');
};

const onSubmitSuccess = () => {
  console.log('问卷提交成功');
};
</script>

四、API

4.1 Props

4.2 Events

4.3 方法

透過 ref 可以呼叫元件的方法：