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>
相关推荐
pas1368 小时前
42-mini-vue 实现 transform 功能
前端·javascript·vue.js
你的代码我的心9 小时前
微信开发者工具开发网页,不支持tailwindcss v4怎么办?
开发语言·javascript·ecmascript
努力d小白9 小时前
leetcode438.找到字符串中所有字母异位词
java·javascript·算法
2501_915918419 小时前
在 iOS 环境下查看 App 详细信息与文件目录
android·ios·小程序·https·uni-app·iphone·webview
小白路过9 小时前
记录vue-cli-service serve启动本地服务卡住问题
前端·javascript·vue.js
前端呆头鹅9 小时前
Websocket使用方案详解(uniapp版)
websocket·网络协议·uni-app
梵得儿SHI9 小时前
Vue 高级特性:渲染函数与 JSX 精讲(h 函数语法、JSX 在 Vue 中的应用)
前端·javascript·vue.js·jsx·模板语法·渲染函数·底层视图生成机制
GGGG寄了9 小时前
CSS——文字控制属性
前端·javascript·css·html
菜鸟茜9 小时前
ES6核心知识解析01:什么是ES6以及为什么需要ES6
前端·javascript·es6
David凉宸9 小时前
Vue 3 项目的性能优化策略:从原理到实践(页面展示)
javascript·vue.js·性能优化