import clonedeep from 'lodash.clonedeep' ; import Rx from './rx' ; import { mpapp } from './types' ; import { reduceDataLifeCycleMethod } from './util' ; /**
 * A simple factory function, let mini app development more compose and reactive
 * page object includes:
 * 1. data => wxml/axml need data
 * 2. mixins: {data, method, lifycycle, ...other} => compose unit
 * 3. lifycycle mehtod => onLoad, onReady...
 * 4. method => event handler
 * 5. getter => ql(reactive data)
 * 6. effect => rl (reactive side effect)
 * 7. action => response page
 */ export default function Mue ( page ) { const reducer = { data : [ ] , onLoad : [ ] , onReady : [ ] , onShow : [ ] , onHide : [ ] , onUnload : [ ] , onPullDownRefresh : [ ] , onReachBottom : [ ] , onShareAppMessage : [ ] , onPageScroll : [ ] , onTitleClick : [ ] , onResize : [ ] , onTabItemTap : [ ] } ; const { dev = false , mixins = [ ] , getter , effect , action , ... rest } = page ; if ( dev ) { console . log ( '=================🚀bmue bootstrap🚀=================' ) ; } let pageObj = { } ; for ( let mixin of mixins ) { const mixinRest = reduceDataLifeCycleMethod ( mixin , reducer ) ; pageObj = { ... pageObj , ... mixinRest } ; } const actionRest = reduceDataLifeCycleMethod ( action , reducer ) ; const pageRest = reduceDataLifeCycleMethod ( rest , reducer ) ; [ 'onLoad' , 'onReady' , 'onShow' , 'onHide' , 'onUnload' , 'onPullDownRefresh' , 'onReachBottom' , 'onShareAppMessage' , 'onPageScroll' , 'onTitleClick' , 'onResize' , 'onTabItemTap' ] . forEach ( lifecycle => { const list = reducer [ lifecycle ] . filter ( ( method ) => method ) ; if ( list . length > 0 ) { pageObj [ lifecycle ] = function ( arg ) { list . forEach ( ( v ) => v . call ( this , arg ) ) ; } ; } } ) ; const mergeData = reducer . data . filter ( data => data ) . reduce ( ( pre , cur ) => ( { ... pre , ... cur } ) , { rx : { } } ) || { } ; const rx = new Rx ( { dev , data : mergeData , getter , effect } ) ; pageObj = { ... rx , ... pageObj , ... actionRest , ... pageRest } ; pageObj [ 'setState' ] = function ( arg , cb ) { if ( dev ) { console . groupCollapsed ( '================setState===================' ) ; console . log ( 'param:' , arg ) ; } this . setData ( arg , ( ) => { if ( dev ) { console . log ( this . data ) ; } const data = clonedeep ( this . data ) ; const rx = this . computeQL ( data ) ; if ( dev ) { console . log ( 'rx:' , rx ) ; } this . setData ( { rx : { ... this . data . rx , ... rx } } ) ; this . effect . forEach ( ( effect ) => { effect . apply ( this , [ data , this ] ) ; } ) ; if ( dev ) { console . groupEnd ( ) ; } } ) ; } ; pageObj [ 'spliceState' ] = function ( arg ) { if ( dev ) { console . groupCollapsed ( '================spliceState===================' ) ; console . log ( 'param:' , arg ) ; } this . $spliceData ( arg , ( ) => { const data = clonedeep ( this . data ) ; const rx = this . computeQL ( data ) ; if ( dev ) { console . log ( 'rx:' , rx ) ; } this . setData ( { rx : { ... this . data . rx , ... rx } } ) ; this . effect . forEach ( ( effect ) => { effect . apply ( this , [ data , this ] ) ; } ) ; if ( dev ) { console . groupEnd ( ) ; } } ) ; } ; return Page ( pageObj ) ; }