about.vue 1.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657
  1. <route lang="json5">
  2. {
  3. layout: 'tabbar',
  4. style: {
  5. navigationBarTitleText: '关于',
  6. },
  7. }
  8. </route>
  9. <template>
  10. <view>
  11. <view
  12. class="bg-white overflow-hidden pt-2 px-4"
  13. :style="{ marginTop: safeAreaInsets?.top + 'px' }"
  14. >
  15. <view class="text-center text-3xl mt-8">
  16. 鸽友们好,我是
  17. <text class="text-red-500">菲鸽</text>
  18. </view>
  19. <!-- <button @click="toSubPage()">去分包</button> -->
  20. <view class="test-css">测试 scss 样式</view>
  21. <RequestComp />
  22. <UploadComp />
  23. </view>
  24. </view>
  25. </template>
  26. <script lang="ts" setup>
  27. import RequestComp from './components/request.vue'
  28. import UploadComp from './components/upload.vue'
  29. // 获取屏幕边界到安全区域距离
  30. const { safeAreaInsets } = uni.getSystemInfoSync()
  31. const toSubPage = () => {
  32. uni.navigateTo({
  33. url: '/pages-sub/demo/index',
  34. })
  35. }
  36. // 奇怪:同样的代码放在 vue 里面不会校验到错误,放在 .ts 文件里面会校验到错误
  37. // const testOxlint = (name: string) => {
  38. // console.log('oxlint')
  39. // }
  40. // testOxlint('oxlint')
  41. console.log('about')
  42. </script>
  43. <style lang="scss" scoped>
  44. .test-css {
  45. // 16rpx=>0.5rem
  46. padding-bottom: 16rpx;
  47. // mt-4=>1rem=>16px;
  48. margin-top: 16px;
  49. text-align: center;
  50. }
  51. </style>