SOURCE

console 命令行工具 X clear

                    
>
console
// Vue.use(VXEUtils, XEUtils)
// Vue.use(VXEAjax, XEAjax)

// var Main = {
//   data() {
//     return {
//       tableData: []
//     }
//   },
//   mounted () {
//     window.that = this
//   }
// };
// var Ctor = Vue.extend(Main);
// new Ctor().$mount('#app')

var App = {
  setup(){
    return {
        url: 'https://scp-static.cicsc.com/uat/spreadChannel/7454145363443712/template7454145363443712.png' 
    }
  },
  mounted() {
    window.that = this
  },
  methods: {
      clickBtn(e) {
         // 下载进度
        // 创建一个进度监听对象
        let progress = new XEAjax.Progress()
        // 监听下载进度
        progress.onDownloadProgress = evnt => {
            let value = progress.value
            let loadedSize = progress.loaded.size
            let loadedUnit = progress.loaded.unit
            let totalSize = progress.total.size
            let totalUnit = progress.total.unit
            let speedSize = progress.speed.size
            let speedUnit = progress.speed.unit
            let remaining = progress.remaining
            console.log(`进度:${value}% ${loadedSize}${loadedUnit}${totalSize}/${totalUnit}; 速度:${speedSize}/${speedUnit}秒; 剩余:${remaining}秒`)
        }
        XEAjax.fetchGet(this.url, {progress, method: 'GET'})
            .then(res=>{
                console.log(res)
            }).catch(e => {
                    alert('不支持跨域')
            })
      }

  }
}

var app = window.app = Vue.createApp(App)
app.use(VXEUtils, XEUtils)
app.use(VXEAjax, XEAjax)
app.mount("#app");
<script src="//unpkg.com/vue@3.0.0-beta.14"></script>
<script src="//unpkg.com/xe-utils"></script>
<script src="//unpkg.com/vxe-utils"></script>
<script src="//unpkg.com/xe-ajax"></script>
<script src="//unpkg.com/vxe-ajax"></script>

 <div id="app">
    <input v-model="url"></input>
  <button @click="clickBtn">测试跨域</button>
</div>