4***@qq.com
4***@qq.com
  • 发布:2023-08-10 14:07
  • 更新:2024-12-31 12:09
  • 阅读:260

vue3+ts class-style

分类:uni-app

因为我本身是java程序员,习惯了ts class-style模式的语法糖。
vue2的时候用的是vue-property-decorator,但是在vue3下
使用vue-property-decorator会报错,而且这个插件已不再维护。
google了半天,找到另外一个开源的插件vue-facing-decorator。

目前已经整合到vue3 uniapp 中,以下是代码示例,习惯
class-style语法糖的同学,可以拿去用拉。

对于uniapp 生命周期函数,可以通过挂载的方式实现。


import { MyVue } from "@/common/MyVue";  
import LoggerUtil from "@/utils/LoggerUtil";  
import { Component } from "vue-facing-decorator";  
@Component  
export default class Home extends MyVue {  
    title = "hello";  
    onLoad() {  
        uni.setNavigationBarTitle({ title: "首页" });  
        LoggerUtil.info("App onLoad111111");  
    }  
    onShow() {  
        LoggerUtil.info("App Show 1");  
        this.title += ",vue3"  
    }  
    onHide() {  
        LoggerUtil.info("App Hide");  
    }  
    onChange() {  
        LoggerUtil.info("App Change");  
        this.title += ",vue3"  
    }  

}  

vx: BusyMr-QHD

2 关注 分享
r***@qq.com BFC

要回复文章请先登录注册

h***@163.com

h***@163.com

这样写uniapp 生命周期不执行;uniapp 生命周期需加上 @Hook 装饰器
2024-12-31 12:09
r***@qq.com

r***@qq.com

大神,能说一下@/common/MyVue是怎么写的吗
2024-08-14 16:34