vue3新特性的使用

1、Suspense组件：等待异步组件时渲染一些额外内容，让应用有更好的用户体验

例：

<template>
　　<div class="app">
　　　　<h3>我是App组件</h3>
　　　　<Suspense>
　　　　　　<template v-slot:default>
　　　　　　　　　　<Child/>
　　　　　　</template>
　　　　　　<template v-slot:fallback>
　　　　　　　　<h3>加载中.....</h3>
　　　　　　</template>
　　　　</Suspense>
　　</div>
</template>

2、defineAsyncComponent：延迟加载组件

<component :is="components.get('Form'+formname(store.getters.getapplyData.formid[0]))"></component>

// 需要加载的组件集合
const components = markRaw(new Map<string, any>())
for(let i=0;i<5;i++){
  components.set(
      `Form${i+1}`,
      defineAsyncComponent(() => import('../../components/Form'+(i+1)+'.vue'))
  )
}

3、markRaw：当渲染具有不可变数据源的大列表时,跳过响应式转换可以提高性能

const components = markRaw(new Map<string, any>())
for(let i=0;i<5;i++){
  components.set(
      `Form${i+1}`,
      defineAsyncComponent(() => import('../../components/Form'+(i+1)+'.vue'))
  )
}

     将components变成不响应式的，提高性能