una 555f32e75b no message 8 ヶ月 前
..
lifecycle 555f32e75b no message 8 ヶ月 前
methods 555f32e75b no message 8 ヶ月 前
utils 555f32e75b no message 8 ヶ月 前
changelog.md 555f32e75b no message 8 ヶ月 前
index.js 555f32e75b no message 8 ヶ月 前
index.ts 555f32e75b no message 8 ヶ月 前
package.json 555f32e75b no message 8 ヶ月 前
readme.md 555f32e75b no message 8 ヶ月 前

readme.md

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这种方式。