事件列表

<template>
  <umo-office-viewer
    v-bind="options"
    @loaded="onLoaded"
    @closed="onClosed"
    @aside-changed="onAsideChanged"
    @page-changed="onPageChanged"
    @rotate-changed="onRotateChanged"
    @scale-changed="onScaleChanged"
    @fullscreen-changed="onFullscreenChanged"
    @download="onDownload"
    @export="onExport"
    @print="onPrint"
    @error="onError"
  />
</template>
 
<script setup>
  import { ref } from 'vue';
  import { UmoOfficeViewer } from '@umoteam/office-viewer';
 
  const options = ref({
    // 配置项
    // ...
  });
 
  const onLoaded = () => {
    console.log('emit:loaded', '文档加载完成')
  }
  const onClosed = () => {
    console.log('emit:closed', '点击了关闭按钮')
  }
  const onAsideChanged = (aside: 'info' | 'thumbs') => {
    console.log('emit:aside-changed', '开启侧边栏并切换面板:', { aside })
  }
  const onPageChanged = (activePage: number) => {
    console.log('emit:page-changed', '当前页码变化:', { activePage })
  }
  const onRotateChanged = (rotate: number) => {
    console.log('emit:rotate-changed', '旋转角度发生变化:', { rotate })
  }
  const onScaleChanged = (scale: number) => {
    console.log('emit:scale-changed', '缩放比例变化:', {scale})
  }
  const onFullscreenChanged = (fullscreen: boolean) => {
    console.log('emit:fullscreen-changed', '全屏状态发生变化:',  { fullscreen })
  }
  const onDownload = () => {
    console.log('emit:download', '下载文档')
  }
  const onPrint = () => {
    console.log('emit:print', '打印文档')
  }
  const onExport = () => {
    console.log('emit:export', '导出文档')
  }
  const onError = (error) => {
    console.log('emit:error', '文档加载出错', { errMsg: error.message })
  }
</script>