App.tsx 992 B

12345678910111213141516171819202122232425262728293031323334353637383940
  1. import { Toast } from 'vant'
  2. import { defineComponent, reactive } from 'vue'
  3. import { Vue3Lottie } from 'vue3-lottie'
  4. import AstronautJSON from '../components/o-full-refresh/datas/data.json'
  5. import baseEvent from '@/base-event'
  6. export default defineComponent({
  7. name: 'App',
  8. setup() {
  9. const state = reactive({
  10. showToast: false
  11. })
  12. baseEvent.on('toastShow', () => {
  13. state.showToast = true
  14. })
  15. baseEvent.on('toastClose', () => {
  16. state.showToast = false
  17. })
  18. return () => (
  19. <>
  20. <router-view></router-view>
  21. <div class={'appRootToast'}>
  22. <Toast v-model:show={state.showToast} overlay duration={30000}>
  23. {{
  24. message: () => (
  25. <>
  26. <Vue3Lottie class={'toastAnimate'} animationData={AstronautJSON}></Vue3Lottie>
  27. {/* <p>加载中...</p> */}
  28. </>
  29. )
  30. }}
  31. </Toast>
  32. </div>
  33. </>
  34. )
  35. }
  36. })