更新记录
1.0.7(2023-05-17) 下载此版本
1.优化pageLifetimes兼容 2.支持简易兑换
1.0.6(2023-04-12) 下载此版本
为防冲突,给selectComponent两个函数添加前缀zp
1.0.5(2023-03-28) 下载此版本
修复ts项目找不到setData的问题
查看更多平台兼容性
Vue2 | Vue3 |
---|---|
√ | √ |
App | 快应用 | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 |
---|---|---|---|---|---|---|
HBuilderX 3.1.0 app-vue | √ | √ | √ | √ | √ | √ |
钉钉小程序 | 快手小程序 | 飞书小程序 | 京东小程序 |
---|---|---|---|
√ | √ | √ | √ |
H5-Safari | Android Browser | 微信浏览器(Android) | QQ浏览器(Android) | Chrome | IE | Edge | Firefox | PC-Safari |
---|---|---|---|---|---|---|---|---|
√ | √ | √ | √ | √ | √ | √ | √ | √ |
zp-mixins
本插件,基本无法单独使用。
为方便miniprogram-to-uniapp(小程序转uniapp项目)工具后续升级,特单独摘出做成插件,便于后续更新。
注意:
1.本插件仅限于miniprogram-to-uniapp(小程序转uni-app项目)转换工具使用,
2.如果是新项目或uni-app项目,建议还是使用vue/uni-app它自身支持的方式实现,效率更高些。
3.目前仅支持vue2/vue3的options写法。至于setup,因其天生弱化mixin,也无this,建议直接import导入按需使用吧~
安装
点击右侧 “使用 HBuilderX 导入插件” 按钮,并选择对应项目。
使用
在main.js文件里面增加引用,即可全局使用这些函数,如下所示:
import App from './App'
// 添加zpMixins
import zpMixins from '@/uni_modules/zp-mixins/index.js'
// #ifndef VUE3
import Vue from 'vue'
Vue.use(zpMixins)
Vue.config.productionTip = false
App.mpType = 'app'
const app = new Vue({
...App
})
app.$mount()
// #endif
// #ifdef VUE3
import { createSSRApp } from 'vue'
export function createApp() {
const app = createSSRApp(App)
app.mixin(zpMixins)
return {
app
}
}
// #endif
注意:vue3项目仅支持Options API方式(setup API写法有点不同,不支持这种方式使用,建议直接通过import引入使用)。
功能介绍
pageLifetimes(组件所在页面的生命周期)
处理组件里的pageLifetimes
clone(深拷贝)
深拷贝的简单版本,未处理循环引用。
handleDataset
用于处理dataset
在自定义组件的事件里,是获取不到e.currentTarget.dataset的
因此收集data-参数,手动传进去
html2Escape 普通字符转换成转义符
用于替换wxParse为mp-html时使用
escape2Html 转义符换成普通字符
暂未用上
parseEventDynamicCode
解析事件里的动态函数名,这种没有()的函数名,在uniapp不被执行
比如:
getTabBar
实现小程序自定义组件的this.getTabBar().setData()函数
getRelationNodes
获取组件间关系this.getRelationNodes()
注意:
1.须与p-f-unicom配合使用!
2.并不能与小程序的getRelationNodes相提并论,因为底层实现不一样
selectComponent
selectAllComponents
抹平各平台差异,实现类似于小程序的selectComponent和selectAllComponents函数。
使用方式与小程序一致。
注:新项目建议还是使用ref这种方式,获取组件实例。
setData
1.实现setData函数,让uni-app也能支持使用setData函数。 2.实现微信“简易双向绑定”
注意:本函数仅为小程序转换uniapp项目所作的支撑,如uni-app项目里,最好还是使用this.xx这种方式。