开播与观看（Web）

<template>
   <StreamMixer />
</template>

<script setup lang="ts">
import { StreamMixer } from 'tuikit-atomicx-vue3';
</script>

import { onMounted } from 'vue';
import { useDeviceState } from 'tuikit-atomicx-vue3';
const { openLocalCamera, openLocalMicrophone } = useDeviceState();

onMounted(() => {   
  openLocalMicrophone();
  openLocalCamera();
})

import { useLiveListState } from 'tuikit-atomicx-vue3';

const { createLive } = useLiveListState();

async function startLive() {
  try {
    await createLive({
      liveId: liveId.value, // 设置直播的房间 id
      liveName: 'test 直播', // 设置直播的房间名称
    });
  } catch (error) {
    console.error('创建直播失败:', error);
  }
}

<template>
   <LiveView />
</template>

<script setup lang="ts">
import { LiveView } from 'tuikit-atomicx-vue3';
</script>

import { useLiveListState } from 'tuikit-atomicx-vue3';

const { joinLive } = useLiveListState();

// 加入直播
async function joinLiveRoom() {
  try {
    await joinLive({ liveId: liveId.value }); // 与主播开播同样的 liveID
  } catch (error) {
    console.error('加入直播间失败:', error);
  }
}

import { useLiveListState } from 'tuikit-atomicx-vue3';

const { leaveLive } = useLiveListState();

// 加入直播
async function exitLive() {
  try {
    await leaveLive(); 
    // 您可以在这里进行页面的跳转
  } catch (error) {
    console.error('离开直播间失败:', error);
  }
}