Vue Component vue-office-excel doesn't work

I'm a new to code vue page. I want to use vue-office-excel component in my Vue page, it can show an excel file on my page. My vue script is like this.

index.vue:

<template>
    <vue-office-excel :src="'http://static.shanhuxueyuan.com/test.xlsx'" :options="options" @rendered="rendered" @error="error"
           style="height: 100vh;" />
</template>

<script setup>
    import { VueOfficeExcel } from '@vue-office/excel'
    import '@vue-office/excel/lib/index.css'

    const options = ref({
      xls: true,       
      minColLength: 0,  
      minRowLength: 0,  
      widthOffset: 10,  
      heightOffset: 10, 
      beforeTransformData: (workbookData) => {return workbookData}, 
      transformData: (workbookData) => {return workbookData}
    });

    const rendered = () => {
        console.log('Excel rendered')
    }
  
    const error = (error) => {
        console.error('Error loading Excel', error)
    }
</script>

I have set the configurations in package.json as:

{
    ...
    "dependencies": {
        ...,
        "@js-preview/excel": "^1.7.3",
        "@vue-office/excel": "^1.7.3",
        "vue-demi": "^0.14.6",
        "vue": "3.4.31",
        ...
    },
    ...
}

Now it doesn't work, the page shows nothing, and anything is not printed on the console. I'm using Chrome browser ver 136.0.7103.93. I've tried the example, that works correctly.