@miapp/app
v2.0.2
Published
小程序开发框架
Downloads
10
Keywords
Readme
app
小程序开发框架
使用
使用 createApp/createPage/createComponent
包裹对应类型的初始化配置,让实例具备以下方法:
- 跳转关闭:
open/close
- 事件相关:
on/off/emit
- 获取实例:
getApp/getPage
兼容插件 - 获取参数:
getParams/getLaunchOptions
使用 createPlugin
包裹插件配置,让插件具备以下方法:
getData
:获取插件数据,支持a.b.c.d
链式获取setData
:设置插件数据,支持a.b.c.d
链式设置getHost
:获取宿主环境(包括当前应用插件的app/page
实例)
由于插件中不能使用 <web-view>
组件,因此插件中调用 this.open(url, { webview: true })
会触发事件冒泡至 app
,然后在 app
中打开 <web-view>
页面(pages/webview/index?url=url
)
跳转和事件等文档请查看 @miapp/utils 和 @miapp/emitter
import {
createApp,
createPage,
createComponent,
createPlugin
} from "@miapp/app";
// app.js
import appConfig from './app.json';
createApp({
mixins: [], // 全局混入
onLaunch() {
this.on('foo', e => console.log('app', e)); // app bar
}
}, appConfig); // 此处要传入 appConfig,用于初始化 plugins
// page.js
createPage({
mixins: [], // 页面混入
onLoad() {
this.on('foo', e => console.log('page', e)); // page bar
console.log(this.getLaunchOptions());
}
});
// component.js
createComponent({
onInit() {
this.on('foo', e => console.log('component', e)); // component bar
},
didMount() {
this.emit('foo|app', 'bar'); // 冒泡 component => page => app
this.getParams(); // 获取页面参数
this.getLaunchOptions(); // 获取APP参数
}
});
// plugin.js
createPlugin({
data: {
foo: {
bar: 'yes'
}
},
methods: {
sayHello() {
console.log('hello');
},
log() {
this.sayHello(); // hello
this.getData('foo.bar'); // yes
this.getHost().app; // 当前 getApp() 获取的实例
this.getHost().page; // 当前应用插件的页面实例
}
}
});
requirePlugin('plugin').setData('foo.bar'); // no
Mixins
支持对象或函数类型的混入方式
export const loading = {
showLoading() {
this.emit('show:loading');
},
hideLoading() {
this.emit('hide:loading');
}
}
export const mixinLoading = (target) => {
target.showLoading = function () {
this.emit('show:loading');
};
target.hideLoading = function () {
this.emit('hide:loading');
};
return target;
};
开发
更多命令
miapp newbranch
: 新建分支miapp push
: 提交代码miapp prepub
: 预发(发布 beta 版本)miapp publish
: 正式发布