uniapp 微信小程序页面JS模板

这段代码展示了一个Vue3 + uni-app的页面逻辑实现,主要功能包括:

页面初始化时检查登录状态、初始化默认数据和加载数据

处理页面显示时的重新加载逻辑

实现下拉刷新功能

通过API获取本地定时器数据

代码使用了Vue3的

javascript 复制代码
<script setup>
import { ref, reactive } from 'vue';
import { MyAPI } from '@/api/index.js';
import { onLoad, onPullDownRefresh, onShow } from '@dcloudio/uni-app';

onLoad(() => PageLogic.initPage());
onShow(() => PageLogic.pageShow());
onPullDownRefresh(() => PageLogic.pagePullDownRefresh());

const pageData = reactive();
class PageLogic {
    static initDefaultData = () => {};
    static initPage = () => {
        MyAPI.checkLogin();
        PageLogic.initDefaultData();
        PageLogic.reload();
    };
    static pageShow = () => {
        if (MyAPI.needReload()) {
            const funcName = MyAPI.getReloadFuncName();
            if (funcName === 'reload') {
                PageLogic.reload();
            }
        }
    };
    static pagePullDownRefresh = async () => {
        await MyAPI.doReload(PageLogic.reload);
    };
    static reload = () => {
        MyAPI.getDeviceAiSetting(MyAPI.getDeviceId())
            .then((res) => {
                pageData.value = res;
            })
            .catch((err) => {
                console.warn(err);
            });
    };
}
</script>
相关推荐
绝美焦栖17 小时前
低版本pdfjs升级
前端·javascript·vue.js
迦南giser17 小时前
webpack从0到1详解
前端·javascript·css·webpack·node.js
xkxnq17 小时前
第二阶段:Vue 组件化开发(第 26天)
前端·javascript·vue.js
华玥作者17 小时前
uni-app + Vite 项目中使用 @uni-helper/vite-plugin-uni-pages 实现自动路由配置(超详细)
前端·uni-app·vue·vue3·vite
小救星小杜、17 小时前
el-form 表格校验 开始和结束时间,时间选择范围
javascript·vue.js·elementui
狼性书生17 小时前
uniapp+vue3实现的简单吐司通知弹窗组件
前端·uni-app·vue·组件·插件
克里斯蒂亚诺更新18 小时前
使用elementUI的表格报错ResizeObserver loop completed with undelivered notifications.
前端·javascript·elementui
C_心欲无痕18 小时前
移动端 B 站弹幕功能实现
前端·javascript
菜鸟很沉18 小时前
Vue 3 组件双向绑定完全指南:update:modelValue 与 defineModel
前端·javascript·vue.js
爱吃香菜i18 小时前
数据连接开发设计文档
前端·javascript