互动管理
<p>[TOC]</p>
<h4>示例</h4>
<pre><code class="language-html"> <vh-interaction-management
v-if="sdkInstance"
ref="interactionManagement"
:roomId="roomInfo.room_id"
:docPermissionId="docPermission"
:accountId="roomInfo.third_party_user_id"
:speakerList="speakerList"
:sdkInstance="sdkInstance"
></vh-interaction-management></code></pre>
<p>互动管理组件依赖互动 sdk 的加入和离开房间事件,所以初始化互动 sdk 实例时,需要传入 attributes 自定义字段,需要包含 role_name 和 nickname 字段。</p>
<pre><code class="language-javascript">let context = {
nickname: this.userInfo.nickname,
role_name: this.roomInfo.role_name
}
let options = {
accountId: this.roomInfo.third_party_user_id, // 第三方用户ID,必填 *不能是中文
inavId: this.roomInfo.inav_id, // 房间ID,必填
appId: this.roomInfo.app_id, // 应用ID,必填
roomId: this.roomInfo.room_id,
token: this.roomInfo.paas_access_token, // access_token,必填
role: this.roomInfo.role_name == 1 ? VhallRTC.MASTER : VhallRTC.GUEST,
attributes: JSON.stringify(context)
}
console.log('初始化互动sdk参数', options)
VhallRTC.createInstance(
options,
res => {
this.sdkInstance = res.vhallrtc
console.log('互动SDK初始化成功', res)
resolve()
},
error => {
console.error('互动SDK初始化失败', error)
reject()
}
)</code></pre>
<h4>props</h4>
<table>
<thead>
<tr>
<th style="text-align: left;">参数</th>
<th style="text-align: left;">说明</th>
<th style="text-align: left;">类型</th>
<th style="text-align: left;">可选值</th>
<th style="text-align: left;">默认值</th>
<th style="text-align: left;">必填</th>
</tr>
</thead>
<tbody>
<tr>
<td style="text-align: left;">sdkInstance</td>
<td style="text-align: left;">互动 SDK 实例</td>
<td style="text-align: left;">object</td>
<td style="text-align: left;">-</td>
<td style="text-align: left;">-</td>
<td style="text-align: left;">是</td>
</tr>
<tr>
<td style="text-align: left;">accountId</td>
<td style="text-align: left;">用户 ID</td>
<td style="text-align: left;">string</td>
<td style="text-align: left;">-</td>
<td style="text-align: left;"></td>
<td style="text-align: left;">是</td>
</tr>
<tr>
<td style="text-align: left;">roomId</td>
<td style="text-align: left;">房间 ID</td>
<td style="text-align: left;">string</td>
<td style="text-align: left;">-</td>
<td style="text-align: left;">-</td>
<td style="text-align: left;">是</td>
</tr>
<tr>
<td style="text-align: left;">docPermissionId</td>
<td style="text-align: left;">主讲人 ID</td>
<td style="text-align: left;">string</td>
<td style="text-align: left;">-</td>
<td style="text-align: left;">-</td>
<td style="text-align: left;">是</td>
</tr>
<tr>
<td style="text-align: left;">speakerList</td>
<td style="text-align: left;">上麦人员列表</td>
<td style="text-align: left;">array</td>
<td style="text-align: left;">-</td>
<td style="text-align: left;">[]</td>
<td style="text-align: left;">是</td>
</tr>
</tbody>
</table>
<h4>sdkInstance</h4>
<p>参考互动组件</p>