73 lines
2.3 KiB
Vue
73 lines
2.3 KiB
Vue
<!-- 使用 type="home" 属性设置首页,其他页面不需要设置,默认为page;推荐使用json5,更强大,且允许注释 -->
|
||
<route lang="json5" type="home">
|
||
{
|
||
layout: 'tabbar',
|
||
style: {
|
||
// 'custom' 表示开启自定义导航栏,默认 'default'
|
||
navigationStyle: 'custom',
|
||
navigationBarTitleText: '首页',
|
||
},
|
||
}
|
||
</route>
|
||
<template>
|
||
<view class="bg-white pt-2 px-4" :style="{ marginTop: safeAreaInsets?.top + 'px' }">
|
||
<view class="mt-12">
|
||
<image src="/static/logo.svg" alt="" class="w-28 h-28 block mx-auto" />
|
||
</view>
|
||
<view class="text-center text-4xl text-[#d14328] mt-4">unibest</view>
|
||
<view class="text-center text-2xl mt-2 mb-8">最好用的 uniapp 开发模板</view>
|
||
|
||
<view class="text-justify max-w-100 m-auto text-4 indent mb-2">{{ description }}</view>
|
||
<view class="text-center mt-8">
|
||
当前平台是:
|
||
<text class="text-green-500">{{ PLATFORM.platform }}</text>
|
||
</view>
|
||
<view class="text-center mt-4">
|
||
模板分支是:
|
||
<text class="text-green-500">i18n</text>
|
||
</view>
|
||
</view>
|
||
<tabbar />
|
||
</template>
|
||
|
||
<script lang="ts" setup>
|
||
import PLATFORM from '@/utils/platform'
|
||
|
||
defineOptions({
|
||
name: 'Home',
|
||
})
|
||
|
||
// 获取屏幕边界到安全区域距离
|
||
let safeAreaInsets
|
||
let systemInfo
|
||
|
||
// #ifdef MP-WEIXIN
|
||
// 微信小程序使用新的API
|
||
systemInfo = uni.getWindowInfo()
|
||
safeAreaInsets = systemInfo.safeArea
|
||
? {
|
||
top: systemInfo.safeArea.top,
|
||
right: systemInfo.windowWidth - systemInfo.safeArea.right,
|
||
bottom: systemInfo.windowHeight - systemInfo.safeArea.bottom,
|
||
left: systemInfo.safeArea.left,
|
||
}
|
||
: null
|
||
// #endif
|
||
|
||
// #ifndef MP-WEIXIN
|
||
// 其他平台继续使用uni API
|
||
systemInfo = uni.getSystemInfoSync()
|
||
safeAreaInsets = systemInfo.safeAreaInsets
|
||
// #endif
|
||
const author = ref('菲鸽')
|
||
const description = ref(
|
||
'unibest 是一个集成了多种工具和技术的 uniapp 开发模板,由 uniapp + Vue3 + Ts + Vite5 + UnoCss + VSCode 构建,模板具有代码提示、自动格式化、统一配置、代码片段等功能,并内置了许多常用的基本组件和基本功能,让你编写 uniapp 拥有 best 体验。',
|
||
)
|
||
// 测试 uni API 自动引入
|
||
onLoad(() => {
|
||
console.log('项目作者:', author.value)
|
||
})
|
||
|
||
console.log('index')
|
||
</script>
|