@goldfishjs/composition-api - npm Package Compare versions

Comparing version 2.4.2 to 2.5.0

babel-plugin-import-config.js

@@ -24,3 +24,2 @@ const libraryName = require('./package.json').name;
       useInitDataReady: `${codeDir}/useInitDataReady`,
-      useGlobalData: `${codeDir}/useGlobalData`,
       useWatch: `${codeDir}/useWatch`,
@@ -27,0 +26,0 @@ useAutorun: `${codeDir}/useAutorun`,

CHANGELOG.md

@@ -6,2 +6,13 @@ # Change Log
 
+# [2.5.0](https://github.com/alipay/goldfish/compare/v2.4.2...v2.5.0) (2022-03-03)
+
+
+### Features
+
+* create setup in advance. ([86a7048](https://github.com/alipay/goldfish/commit/86a70486ba833067e311e526d80ec79e989f0244))
+
+
+
+
+
 ## [2.4.2](https://github.com/alipay/goldfish/compare/v2.4.1...v2.4.2) (2022-03-01)
@@ -8,0 +19,0 @@

lib/appendFn.js

@@ -10,5 +10,7 @@ export default function appendFn(options, name, fns) {
 
+      var result;
       fns.forEach(function (fn) {
-        fn.call.apply(fn, [_this].concat(args));
+        result = fn.call.apply(fn, [_this].concat(args));
       });
+      return result;
     };
@@ -24,7 +26,8 @@ } else if (typeof options[name] === 'function') {
 
-      (_options$name = options[name]).call.apply(_options$name, [this].concat(args));
+      var result = (_options$name = options[name]).call.apply(_options$name, [this].concat(args));
 
       fns.forEach(function (fn) {
-        fn.call.apply(fn, [_this2].concat(args));
+        result = fn.call.apply(fn, [_this2].concat(args));
       });
+      return result;
     };
@@ -31,0 +34,0 @@ } else {

lib/index.d.ts

@@ -10,3 +10,3 @@ export { default as useComponentLifeCycle } from './useComponentLifeCycle';
 export { default as Setup } from './setup/Setup';
-export { ISetupFunction } from './integrateSetupFunctionResult';
+export { ISetupFunction } from './setup/CommonSetup';
 export { default as useState } from './useState';
@@ -19,3 +19,2 @@ export { default as useValue } from './useValue';
 export { default as useInitDataReady } from './useInitDataReady';
-export { default as useGlobalData } from './useGlobalData';
 export { default as useWatch } from './useWatch';
@@ -22,0 +21,0 @@ export { default as useAutorun } from './useAutorun';

lib/index.js

@@ -17,3 +17,2 @@ export { default as useComponentLifeCycle } from './useComponentLifeCycle';
 export { default as useInitDataReady } from './useInitDataReady';
-export { default as useGlobalData } from './useGlobalData';
 export { default as useWatch } from './useWatch';
@@ -20,0 +19,0 @@ export { default as useAutorun } from './useAutorun';

lib/setup/AppSetup.d.ts

 /// <reference types="mini-types" />
 import { AppInstance } from '@goldfishjs/reactive-connect';
 import CommonSetup from './CommonSetup';
-import AppStore from '../connector/store/AppStore';
-export declare type SetupAppStore = AppStore;
-export declare type SetupAppInstance = AppInstance<any, AppStore> & Pick<tinyapp.IAppOptionsMethods, 'onShareAppMessage'>;
-export default class AppSetup extends CommonSetup<Required<tinyapp.IAppOptionsMethods>, SetupAppStore, SetupAppInstance> {
+export declare type SetupAppInstance = AppInstance<any, any> & Pick<tinyapp.IAppOptionsMethods, 'onShareAppMessage'>;
+export default class AppSetup extends CommonSetup<Required<tinyapp.IAppOptionsMethods>, SetupAppInstance> {
     launchOptions?: tinyapp.IAppLaunchOptions;
     addMethod<N extends keyof Required<tinyapp.IAppOptionsMethods>>(name: N, fn: Required<tinyapp.IAppOptionsMethods>[N]): void;
+    destroy(): void;
 }

lib/setup/AppSetup.js

@@ -61,2 +61,9 @@ import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
     }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      _get(_getPrototypeOf(AppSetup.prototype), "destroy", this).call(this);
+
+      this.launchOptions = undefined;
+    }
   }]);
@@ -63,0 +70,0 @@

lib/setup/CommonSetup.d.ts

@@ -0,7 +1,21 @@
+import { IWatchExpressionFn, IWatchCallback, IWatchOptions, AutorunFunction, IErrorCallback, DepList } from '@goldfishjs/reactive';
 import Setup from './Setup';
-export default class CommonSetup<M, S, V> extends Setup {
+export declare type UnAutorun = (() => void) & {
+    depList?: DepList | undefined;
+};
+export interface ISetupFunction {
+    (): Record<string, any>;
+}
+export default class CommonSetup<M, V> extends Setup {
     private fetchInitDataMethod?;
-    private storeInstance?;
     private viewInstance?;
     private methods;
+    private instanceMethods;
+    isSyncDataSafe: boolean;
+    stopWatchDeepList: (() => void)[];
+    compositionState: Record<string, any>;
+    stopWatchList: (() => void)[];
+    stopAutorunList: (() => void)[];
+    autorun(fn: AutorunFunction, errorCb?: IErrorCallback): UnAutorun;
+    watch<R>(fn: IWatchExpressionFn<R>, cb: IWatchCallback<R>, options?: IWatchOptions): import("@goldfishjs/reactive").Unwatch;
     setViewInstance(val: V): void;
@@ -11,7 +25,12 @@ getViewInstance(): V | undefined;
     getFetchInitDataMethod(): (() => Promise<void>) | undefined;
-    setStoreInstance(instance: S): void;
-    getStoreInstance(): S | undefined;
     addMethod<N extends keyof M>(name: N, fn: M[N]): void;
     getMethod<N extends keyof M>(name: N): { [K in keyof M]?: M[K][] | undefined; }[N];
     iterateMethods(cb: <N extends keyof M>(fns: M[N][], name: N) => void): void;
+    addInstanceMethod(name: string, fn: Function): void;
+    getInstanceMethod(name: string): Function[];
+    iterateInstanceMethods(cb: (fns: Function[], name: string) => void): void;
+    executeSetupFunction(fn?: ISetupFunction): void;
+    executeLifeCycleFns(lifeCycleName: string, ...args: any[]): any;
+    watchReactiveData(): void;
+    destroy(): void;
 }

lib/setup/CommonSetup.js

@@ -0,3 +1,7 @@
+import _getMiniDataSetter from "@goldfishjs/reactive-connect/lib/getMiniDataSetter";
+import _watchDeep from "@goldfishjs/reactive/lib/watchDeep";
 import _regeneratorRuntime from "@babel/runtime/regenerator";
 import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
+import _watch from "@goldfishjs/reactive/lib/watch";
+import _autorun from "@goldfishjs/reactive/lib/autorun";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
@@ -11,2 +15,6 @@ import _createClass from "@babel/runtime/helpers/createClass";
 
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
@@ -17,2 +25,3 @@
 import Setup from './Setup';
+import reactive from '../reactive';
 
@@ -37,4 +46,2 @@ var CommonSetup = /*#__PURE__*/function (_Setup) {
 
-    _defineProperty(_assertThisInitialized(_this), "storeInstance", void 0);
-
     _defineProperty(_assertThisInitialized(_this), "viewInstance", void 0);
@@ -44,2 +51,14 @@
 
+    _defineProperty(_assertThisInitialized(_this), "instanceMethods", {});
+
+    _defineProperty(_assertThisInitialized(_this), "isSyncDataSafe", false);
+
+    _defineProperty(_assertThisInitialized(_this), "stopWatchDeepList", []);
+
+    _defineProperty(_assertThisInitialized(_this), "compositionState", {});
+
+    _defineProperty(_assertThisInitialized(_this), "stopWatchList", []);
+
+    _defineProperty(_assertThisInitialized(_this), "stopAutorunList", []);
+
     return _this;
@@ -49,2 +68,18 @@ }
   _createClass(CommonSetup, [{
+    key: "autorun",
+    value: function autorun(fn, errorCb) {
+      var stop = _autorun(fn, errorCb);
+
+      this.stopAutorunList.push(stop);
+      return stop;
+    }
+  }, {
+    key: "watch",
+    value: function watch(fn, cb, options) {
+      var stop = _watch(fn, cb, options);
+
+      this.stopWatchList.push(stop);
+      return stop;
+    }
+  }, {
     key: "setViewInstance",
@@ -109,12 +144,2 @@ value: function setViewInstance(val) {
   }, {
-    key: "setStoreInstance",
-    value: function setStoreInstance(instance) {
-      this.storeInstance = instance;
-    }
-  }, {
-    key: "getStoreInstance",
-    value: function getStoreInstance() {
-      return this.storeInstance;
-    }
-  }, {
     key: "addMethod",
@@ -137,2 +162,141 @@ value: function addMethod(name, fn) {
     }
+  }, {
+    key: "addInstanceMethod",
+    value: function addInstanceMethod(name, fn) {
+      if (name === 'onShareAppMessage') {
+        var onShareAppMessageFns = this.getInstanceMethod('onShareAppMessage');
+
+        if (!onShareAppMessageFns || !onShareAppMessageFns.length) {
+          this.add(this.instanceMethods, name, fn);
+        } else {
+          var oldOnShareAppMessage = onShareAppMessageFns[onShareAppMessageFns.length - 1];
+
+          onShareAppMessageFns[onShareAppMessageFns.length - 1] = function (options) {
+            var previousResult = oldOnShareAppMessage.call(this, options);
+            return _objectSpread(_objectSpread({}, previousResult), fn.call(this, options));
+          };
+        }
+      } else {
+        this.add(this.instanceMethods, name, fn);
+      }
+    }
+  }, {
+    key: "getInstanceMethod",
+    value: function getInstanceMethod(name) {
+      return this.instanceMethods[name];
+    }
+  }, {
+    key: "iterateInstanceMethods",
+    value: function iterateInstanceMethods(cb) {
+      for (var k in this.instanceMethods) {
+        var methodFns = this.instanceMethods[k];
+        cb(methodFns, k);
+      }
+    }
+  }, {
+    key: "executeSetupFunction",
+    value: function executeSetupFunction(fn) {
+      var _this2 = this;
+
+      this.wrap(function () {
+        if (!fn) {
+          throw new Error('Please pass in the setup Function.');
+        }
+
+        var config = {};
+        config = fn();
+        var compositionState = {
+          isInitLoading: true
+        };
+
+        var _loop = function _loop(k) {
+          var value = config[k];
+
+          if (typeof value === 'function') {
+            _this2.addInstanceMethod(k, value);
+          } else {
+            Object.defineProperty(compositionState, k, {
+              configurable: true,
+              enumerable: true,
+              get: function get() {
+                return config[k];
+              },
+              set: function set(v) {
+                config[k] = v;
+              }
+            });
+          }
+        };
+
+        for (var k in config) {
+          _loop(k);
+        } // Convert the returned data to reactive one.
+
+
+        var reactiveCompositionState = reactive(compositionState);
+        _this2.compositionState = reactiveCompositionState;
+      });
+    }
+  }, {
+    key: "executeLifeCycleFns",
+    value: function executeLifeCycleFns(lifeCycleName) {
+      var fns = this.getMethod(lifeCycleName) || [];
+      var result;
+
+      for (var _len2 = arguments.length, args = new Array(_len2 > 1 ? _len2 - 1 : 0), _key2 = 1; _key2 < _len2; _key2++) {
+        args[_key2 - 1] = arguments[_key2];
+      }
+
+      for (var i in fns) {
+        var fn = fns[i];
+        result = fn.call.apply(fn, [this.viewInstance].concat(args));
+      }
+
+      return result;
+    }
+  }, {
+    key: "watchReactiveData",
+    value: function watchReactiveData() {
+      var _this3 = this;
+
+      var compositionState = this.compositionState;
+
+      if (compositionState) {
+        var stopList = [];
+        stopList.push(_watchDeep(compositionState, function (obj, keyPathList, newV, oldV, options) {
+          if (!_this3.isSyncDataSafe) {
+            return;
+          }
+
+          var miniDataSetter = _getMiniDataSetter();
+
+          miniDataSetter.set(_this3.viewInstance, obj, keyPathList, newV, oldV, options);
+        }, {
+          immediate: false
+        }));
+        this.stopWatchDeepList = stopList;
+      }
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      this.isSyncDataSafe = false;
+      this.fetchInitDataMethod = undefined;
+      this.viewInstance = undefined;
+      this.methods = {};
+      this.instanceMethods = {};
+      this.stopWatchDeepList.forEach(function (stop) {
+        return stop();
+      });
+      this.stopWatchDeepList = [];
+      this.compositionState = {};
+      this.stopWatchList.forEach(function (stop) {
+        return stop();
+      });
+      this.stopAutorunList.forEach(function (stop) {
+        return stop();
+      });
+      this.stopWatchList = [];
+      this.stopAutorunList = [];
+    }
   }]);
@@ -139,0 +303,0 @@

lib/setup/ComponentSetup.d.ts

 /// <reference types="mini-types" />
 import { ComponentInstance } from '@goldfishjs/reactive-connect';
 import CommonSetup from './CommonSetup';
-import ComponentStore from '../connector/store/ComponentStore';
 declare type Methods = tinyapp.IComponentLifeCycleMethods<any, any>;
-export declare type SetupComponentStore = ComponentStore<any>;
-export declare type SetupComponentInstance = ComponentInstance<any, any, ComponentStore<any>, {}>;
-export default class ComponentSetup extends CommonSetup<Methods, SetupComponentStore, SetupComponentInstance> {
+export declare type SetupComponentInstance = ComponentInstance<any, any, any, any>;
+export default class ComponentSetup extends CommonSetup<Methods, SetupComponentInstance> {
+    props: Record<string, any>;
+    syncProps(newProps: Record<string, any>): void;
+    destroy(): void;
 }
 export {};

lib/setup/ComponentSetup.js

@@ -0,6 +1,9 @@
+import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 import _createClass from "@babel/runtime/helpers/createClass";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
+import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
+import _get from "@babel/runtime/helpers/get";
 import _inherits from "@babel/runtime/helpers/inherits";
 import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
 
@@ -19,10 +22,38 @@ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
   function ComponentSetup() {
+    var _this;
+
     _classCallCheck(this, ComponentSetup);
 
-    return _super.apply(this, arguments);
+    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+      args[_key] = arguments[_key];
+    }
+
+    _this = _super.call.apply(_super, [this].concat(args));
+
+    _defineProperty(_assertThisInitialized(_this), "props", {});
+
+    return _this;
   }
 
-  return _createClass(ComponentSetup);
+  _createClass(ComponentSetup, [{
+    key: "syncProps",
+    value: function syncProps(newProps) {
+      for (var key in newProps) {
+        if (key in this.props) {
+          this.props[key] = newProps[key];
+        }
+      }
+    }
+  }, {
+    key: "destroy",
+    value: function destroy() {
+      _get(_getPrototypeOf(ComponentSetup.prototype), "destroy", this).call(this);
+
+      this.props = {};
+    }
+  }]);
+
+  return ComponentSetup;
 }(CommonSetup);
 
 export { ComponentSetup as default };

lib/setup/PageSetup.d.ts

 /// <reference types="mini-types" />
 import { PageInstance } from '@goldfishjs/reactive-connect';
 import CommonSetup from './CommonSetup';
-import PageStore from '../connector/store/PageStore';
-export declare type SetupPageStore = PageStore;
-export declare type SetupPageInstance = PageInstance<any, PageStore> & Pick<tinyapp.IPageOptionsMethods, 'onShareAppMessage'>;
-export default class PageSetup extends CommonSetup<Required<tinyapp.IPageOptionsMethods>, SetupPageStore, SetupPageInstance> {
-    query?: tinyapp.Query;
-    addMethod<N extends keyof Required<tinyapp.IPageOptionsMethods>>(name: N, fn: Required<tinyapp.IPageOptionsMethods>[N]): void;
+export declare type SetupPageInstance = PageInstance<any, any> & Pick<tinyapp.IPageOptionsMethods, 'onShareAppMessage'>;
+export default class PageSetup extends CommonSetup<Required<tinyapp.IPageOptionsMethods>, SetupPageInstance> {
+    query: {
+        data: tinyapp.Query | undefined;
+    };
 }

lib/setup/PageSetup.js

@@ -0,5 +1,5 @@
+import _observable from "@goldfishjs/reactive/lib/observable";
+import _createClass from "@babel/runtime/helpers/createClass";
 import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
 import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _get from "@babel/runtime/helpers/get";
 import _inherits from "@babel/runtime/helpers/inherits";
@@ -10,6 +10,2 @@ import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-
 function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
@@ -37,3 +33,5 @@
 
-    _defineProperty(_assertThisInitialized(_this), "query", void 0);
+    _defineProperty(_assertThisInitialized(_this), "query", _observable({
+      data: undefined
+    }));
 
@@ -43,27 +41,5 @@ return _this;
 
-  _createClass(PageSetup, [{
-    key: "addMethod",
-    value: function addMethod(name, fn) {
-      if (name === 'onShareAppMessage') {
-        var view = this.getViewInstance();
-
-        if (view) {
-          var oldOnShareAppMessage = view.onShareAppMessage;
-
-          view.onShareAppMessage = function (options) {
-            var previousResult = oldOnShareAppMessage === null || oldOnShareAppMessage === void 0 ? void 0 : oldOnShareAppMessage.call(view, options);
-            return _objectSpread(_objectSpread({}, previousResult), fn.call(view, options));
-          };
-
-          return;
-        }
-      }
-
-      return _get(_getPrototypeOf(PageSetup.prototype), "addMethod", this).call(this, name, fn);
-    }
-  }]);
-
-  return PageSetup;
+  return _createClass(PageSetup);
 }(CommonSetup);
 
 export { PageSetup as default };

lib/setupApp.d.ts

 /// <reference types="mini-types" />
-import { ISetupFunction } from './integrateSetupFunctionResult';
+import { ISetupFunction } from './setup/CommonSetup';
 export default function setupApp(fn: ISetupFunction): tinyapp.AppOptions;

lib/setupApp.js

@@ -0,132 +1,102 @@
+import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
 import _attachLogic from "@goldfishjs/reactive-connect/lib/attachLogic";
-import _observable from "@goldfishjs/reactive-connect/lib/decorators/observable";
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _get from "@babel/runtime/helpers/get";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _cloneDeep from "@goldfishjs/utils/lib/cloneDeep";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _typeof from "@babel/runtime/helpers/typeof";
 
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-var __decorate = this && this.__decorate || function (decorators, target, key, desc) {
-  var c = arguments.length,
-      r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
-      d;
-  if ((typeof Reflect === "undefined" ? "undefined" : _typeof(Reflect)) === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) {
-    if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-  }
-  return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-
-import AppStore from './connector/store/AppStore';
-import createApp from './connector/view/createApp';
-import integrateLifeCycleMethods from './integrateLifeCycleMethods';
+import { get as keyPathGet } from '@goldfishjs/reactive-connect/lib/MiniDataSetter/keyPath';
 import AppSetup from './setup/AppSetup';
-import integrateSetupFunctionResult from './integrateSetupFunctionResult';
 import appendFn from './appendFn';
+var lifeCycleMethods = ['onLaunch', 'onShow', 'onHide', 'onError', 'onUnhandledRejection'];
 export default function setupApp(fn) {
-  var options = {};
-  var view;
+  var options = {}; // Create the setup instance.
 
-  var BizAppStore = /*#__PURE__*/function (_AppStore) {
-    _inherits(BizAppStore, _AppStore);
+  var setup = new AppSetup(); // Execute the setup function.
 
-    var _super = _createSuper(BizAppStore);
+  setup.executeSetupFunction(fn); // Set the global data.
 
-    function BizAppStore() {
-      var _this;
+  var finalData = options.globalData;
+  var compositionData = setup.compositionState;
 
-      _classCallCheck(this, BizAppStore);
+  if (compositionData) {
+    finalData = _typeof(finalData) === 'object' ? _objectSpread(_objectSpread({}, finalData), _cloneDeep(compositionData)) : _cloneDeep(compositionData);
+  }
 
-      _this = _super.call(this); // Mount store to the app instance.
+  options.globalData = finalData;
 
-      _defineProperty(_assertThisInitialized(_this), "stopWatchDeepList", []);
+  _attachLogic(options, 'onLaunch', 'before', function (options) {
+    var _this = this;
 
-      view.store = _assertThisInitialized(_this);
-      var setup = view.$setup;
-      setup.wrap(function () {
-        _this.stopWatchDeepList = integrateSetupFunctionResult(fn, setup, view, _assertThisInitialized(_this));
-      });
-      return _this;
-    }
+    setup.isSyncDataSafe = true; // Save the launch options.
 
-    _createClass(BizAppStore, [{
-      key: "fetchInitData",
-      value: function () {
-        var _fetchInitData = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-          var fn;
-          return _regeneratorRuntime.wrap(function _callee$(_context) {
-            while (1) {
-              switch (_context.prev = _context.next) {
-                case 0:
-                  _context.next = 2;
-                  return _get(_getPrototypeOf(BizAppStore.prototype), "fetchInitData", this).call(this);
+    setup.launchOptions = options; // Set the app instance.
 
-                case 2:
-                  fn = view.$setup.getFetchInitDataMethod();
-                  _context.t0 = fn;
+    setup.setViewInstance(this); // Mount the instance methods.
 
-                  if (!_context.t0) {
-                    _context.next = 7;
-                    break;
-                  }
+    setup.iterateInstanceMethods(function (fns, name) {
+      appendFn(_this, name, fns);
+    }); // Watch the reactive data.
 
-                  _context.next = 7;
-                  return fn();
+    this.$batchedUpdates = function (cb) {
+      return cb();
+    };
 
-                case 7:
-                case "end":
-                  return _context.stop();
-              }
-            }
-          }, _callee, this);
-        }));
+    this.setData = function (obj) {
+      for (var key in obj) {
+        var keyPathList = keyPathGet(key);
+        keyPathList.reduce(function (prevData, key, index, list) {
+          if (index === list.length - 1) {
+            prevData[key] = obj[key];
+          }
 
-        function fetchInitData() {
-          return _fetchInitData.apply(this, arguments);
-        }
+          return prevData[key];
+        }, _this.globalData);
+      }
+    };
 
-        return fetchInitData;
-      }()
-    }, {
-      key: "destroy",
-      value: function destroy() {
-        _get(_getPrototypeOf(BizAppStore.prototype), "destroy", this).call(this);
+    this.$spliceData = function (obj) {
+      for (var key in obj) {
+        var keyPathList = keyPathGet(key);
+        keyPathList.reduce(function (prevData, key, index, list) {
+          if (index === list.length - 1) {
+            var _prevData$key;
 
-        this.stopWatchDeepList.forEach(function (s) {
-          return s();
-        });
-        this.stopWatchDeepList = [];
+            (_prevData$key = prevData[key]).splice.apply(_prevData$key, [obj[key][0], obj[key][1]].concat(_toConsumableArray(obj[key].slice(2))));
+          }
+
+          return prevData[key];
+        }, _this.globalData);
       }
-    }]);
+    };
 
-    return BizAppStore;
-  }(AppStore);
+    setup.watchReactiveData(); // Init loading
 
-  BizAppStore = __decorate([_observable], BizAppStore);
-  options = createApp(BizAppStore, options, {
-    beforeCreateStore: function beforeCreateStore(v) {
-      var setup = new AppSetup();
-      v.$setup = setup;
-      view = v;
-      setup.launchOptions = v.$launchOptions;
-      setup.iterateMethods(function (fns, name) {
-        appendFn(v, name, fns);
-      });
-    }
-  });
+    var initFn = setup.getFetchInitDataMethod();
 
-  _attachLogic(options, 'onLaunch', 'before', function (options) {
-    this.$launchOptions = options;
-  });
+    var initCompleteHandler = function initCompleteHandler() {
+      setup.compositionState.isInitLoading = false;
+    };
 
-  var lifeCycleMethods = ['onLaunch', 'onShow', 'onHide', 'onError'];
+    Promise.resolve(initFn && initFn()).then(initCompleteHandler, initCompleteHandler);
+  }); // Mount the lifecycle methods.
+
+
+  function integrateLifeCycleMethods(lifeCycleMethods) {
+    return lifeCycleMethods.reduce(function (prev, cur) {
+      prev[cur] = function () {
+        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+          args[_key] = arguments[_key];
+        }
+
+        return setup.executeLifeCycleFns.apply(setup, [cur].concat(args));
+      };
+
+      return prev;
+    }, {});
+  }
+
   var lifeCycleMethodsOptions = integrateLifeCycleMethods(lifeCycleMethods);
@@ -133,0 +103,0 @@ lifeCycleMethods.forEach(function (m) {

lib/setupComponent.d.ts

 /// <reference types="mini-types" />
 import { IProps } from '@goldfishjs/reactive-connect';
-import { ISetupFunction } from './integrateSetupFunctionResult';
+import { ISetupFunction } from './setup/CommonSetup';
 export default function setupComponent<P extends IProps, D = Record<string, any>>(passInFn: ISetupFunction): tinyapp.ComponentOptions<P, D, {}>;
 export default function setupComponent<P, D = Record<string, any>>(passInProps: P, passInFn: ISetupFunction): tinyapp.ComponentOptions<P, D, {}>;
-export default function setupComponent<P, D = Record<string, any>>(passInProps: P, dftData: Partial<D>, passInFn: ISetupFunction): tinyapp.ComponentOptions<P, D, {}>;

lib/setupComponent.js

 import _attachLogic from "@goldfishjs/reactive-connect/lib/attachLogic";
+import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _typeof from "@babel/runtime/helpers/typeof";
 import _cloneDeep from "@goldfishjs/utils/lib/cloneDeep";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _get from "@babel/runtime/helpers/get";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
+import _uniqueId from "@goldfishjs/utils/lib/uniqueId";
 
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
 import observable from '@goldfishjs/reactive/lib/observable';
-import createComponent from './connector/view/createComponent';
-import ComponentStore from './connector/store/ComponentStore';
+import isComponent2 from '@goldfishjs/reactive-connect/lib/isComponent2';
 import appendFn from './appendFn';
-import integrateSetupFunctionResult from './integrateSetupFunctionResult';
 import ComponentSetup from './setup/ComponentSetup';
-import integrateLifeCycleMethods from './integrateLifeCycleMethods';
+import setupManager from './setup/setupManager';
 var lifeCycleMethods = ['onInit', 'deriveDataFromProps', 'didMount', 'didUpdate', 'didUnmount'];
-export default function setupComponent(arg1, arg2, arg3) {
+var COMPONENT_SETUP_ID_KEY = '$$componentSetupId';
+export default function setupComponent(arg1, arg2) {
   var props = undefined;
-  var dftData = undefined;
   var fn = undefined;
 
-  if (typeof arg3 === 'function') {
+  if (typeof arg1 === 'function') {
+    fn = arg1;
+  } else {
     props = arg1;
-    dftData = arg2;
-    fn = arg3;
-  } else if (typeof arg2 === 'function') {
-    props = arg1;
     fn = arg2;
-  } else if (typeof arg1 === 'function') {
-    fn = arg1;
   }
@@ -46,65 +35,101 @@
 
-  if (dftData) {
-    options.data = dftData;
-  }
+  var oldData = options.data; // No `this` for the component data function.
 
-  var view;
+  options.data = function () {
+    var finalData = {};
 
-  var BizComponentStore = /*#__PURE__*/function (_ComponentStore) {
-    _inherits(BizComponentStore, _ComponentStore);
+    if (oldData) {
+      finalData = typeof oldData === 'function' ? oldData() : oldData;
+    } // Create the setup instance.
 
-    var _super = _createSuper(BizComponentStore);
 
-    function BizComponentStore() {
-      var _this;
+    var componentSetupId = _uniqueId('component-setup-');
 
-      _classCallCheck(this, BizComponentStore);
+    finalData[COMPONENT_SETUP_ID_KEY] = componentSetupId;
+    var setup = new ComponentSetup();
+    setupManager.add(componentSetupId, setup); // Get the default props.
 
-      _this = _super.call(this);
+    setup.props = observable(_cloneDeep(props) || {}); // Execute the setup function.
 
-      _defineProperty(_assertThisInitialized(_this), "props", observable(_cloneDeep(props) || {}));
+    setup.executeSetupFunction(fn);
+    var compositionData = setup.compositionState;
 
-      _defineProperty(_assertThisInitialized(_this), "stopWatchDeepList", []);
+    if (compositionData) {
+      finalData = _typeof(finalData) === 'object' ? _objectSpread(_objectSpread({}, finalData), _cloneDeep(compositionData)) : _cloneDeep(compositionData);
+    }
 
-      if (!fn) {
-        throw new Error('Please pass in the setup Function.');
-      }
+    return finalData;
+  };
 
-      var setup = view.$setup;
-      setup.wrap(function () {
-        _this.stopWatchDeepList = integrateSetupFunctionResult(fn, setup, view, _assertThisInitialized(_this));
-      });
-      return _this;
+  var enterKey = isComponent2 ? 'onInit' : 'didMount';
+
+  _attachLogic(options, enterKey, 'before', function () {
+    var _this = this;
+
+    var setup = setupManager.get(this.data[COMPONENT_SETUP_ID_KEY]);
+
+    if (!setup) {
+      return;
     }
 
-    _createClass(BizComponentStore, [{
-      key: "destroy",
-      value: function destroy() {
-        _get(_getPrototypeOf(BizComponentStore.prototype), "destroy", this).call(this);
+    setup.isSyncDataSafe = true; // Set the component instance.
 
-        this.stopWatchDeepList.forEach(function (stop) {
-          return stop();
-        });
-        this.stopWatchDeepList = [];
-      }
-    }]);
+    setup.setViewInstance(this); // Mount the instance methods.
 
-    return BizComponentStore;
-  }(ComponentStore);
+    setup.iterateInstanceMethods(function (fns, name) {
+      appendFn(_this, name, fns);
+    }); // Watch the reactive data.
 
-  options = createComponent(BizComponentStore, options, {
-    beforeCreateStore: function beforeCreateStore(v) {
-      var setup = new ComponentSetup();
-      v.$setup = setup;
-      view = v;
-      setup.iterateMethods(function (fns, name) {
-        appendFn(v, name, fns);
-      });
-    }
-  });
+    setup.watchReactiveData();
+  }); // Sync props in lifecyle.
+
+
+  function defaultSyncHandler() {
+    var setup = setupManager.get(this.data[COMPONENT_SETUP_ID_KEY]);
+    setup === null || setup === void 0 ? void 0 : setup.syncProps(this.props);
+  }
+
+  _attachLogic(options, 'onInit', 'before', defaultSyncHandler);
+
+  _attachLogic(options, 'didMount', 'before', defaultSyncHandler);
+
+  _attachLogic(options, 'didUpdate', 'before', defaultSyncHandler);
+
+  _attachLogic(options, 'deriveDataFromProps', 'before', function (nextProps) {
+    var setup = setupManager.get(this.data[COMPONENT_SETUP_ID_KEY]);
+    setup === null || setup === void 0 ? void 0 : setup.syncProps(nextProps);
+  }); // Mount the lifecycle methods.
+
+
+  function integrateLifeCycleMethods(lifeCycleMethods) {
+    return lifeCycleMethods.reduce(function (prev, cur) {
+      prev[cur] = function () {
+        var setup = setupManager.get(this.data[COMPONENT_SETUP_ID_KEY]);
+
+        if (!setup) {
+          return;
+        }
+
+        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+          args[_key] = arguments[_key];
+        }
+
+        return setup.executeLifeCycleFns.apply(setup, [cur].concat(args));
+      };
+
+      return prev;
+    }, {});
+  }
+
   var lifeCycleMethodsOptions = integrateLifeCycleMethods(lifeCycleMethods);
   lifeCycleMethods.forEach(function (m) {
     _attachLogic(options, m, 'after', lifeCycleMethodsOptions[m]);
+  }); // Destroy
+
+  _attachLogic(options, 'didUnmount', 'after', function () {
+    var setup = setupManager.get(this.data[COMPONENT_SETUP_ID_KEY]);
+    setup === null || setup === void 0 ? void 0 : setup.destroy();
   });
+
   return options;
 }

lib/setupPage.d.ts

 /// <reference types="mini-types" />
-import AppStore from './connector/store/AppStore';
-import { ISetupFunction } from './integrateSetupFunctionResult';
-export default function setupPage<D, AS extends AppStore>(fn: ISetupFunction): tinyapp.PageOptions<D>;
-export default function setupPage<D, AS extends AppStore>(dftData: Partial<D>, fn: ISetupFunction): tinyapp.PageOptions<D>;
+import { ISetupFunction } from './setup/CommonSetup';
+export default function setupPage<D>(fn: ISetupFunction): tinyapp.PageOptions<D>;

lib/setupPage.js

 import _attachLogic from "@goldfishjs/reactive-connect/lib/attachLogic";
-import _observable from "@goldfishjs/reactive-connect/lib/decorators/observable";
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
-import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
-import _createClass from "@babel/runtime/helpers/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/assertThisInitialized";
-import _get from "@babel/runtime/helpers/get";
-import _inherits from "@babel/runtime/helpers/inherits";
-import _possibleConstructorReturn from "@babel/runtime/helpers/possibleConstructorReturn";
-import _getPrototypeOf from "@babel/runtime/helpers/getPrototypeOf";
+import _cloneDeep from "@goldfishjs/utils/lib/cloneDeep";
 import _defineProperty from "@babel/runtime/helpers/defineProperty";
 import _typeof from "@babel/runtime/helpers/typeof";
+import _uniqueId from "@goldfishjs/utils/lib/uniqueId";
 
-function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
 
-function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
-var __decorate = this && this.__decorate || function (decorators, target, key, desc) {
-  var c = arguments.length,
-      r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc,
-      d;
-  if ((typeof Reflect === "undefined" ? "undefined" : _typeof(Reflect)) === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);else for (var i = decorators.length - 1; i >= 0; i--) {
-    if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-  }
-  return c > 3 && r && Object.defineProperty(target, key, r), r;
-};
-
-import createPage from './connector/view/createPage';
-import PageStore from './connector/store/PageStore';
-import integrateSetupFunctionResult from './integrateSetupFunctionResult';
 import PageSetup from './setup/PageSetup';
-import integrateLifeCycleMethods from './integrateLifeCycleMethods';
 import appendFn from './appendFn';
 import integratePageEventMethods from './integratePageEventMethods';
+import setupManager from './setup/setupManager';
 var lifeCycleMethods = ['onPullDownRefresh', 'onTitleClick', 'onOptionMenuClick', 'onPopMenuClick', 'onPullIntercept', 'onTabItemTap', 'onLoad', 'onReady', 'onShow', 'onHide', 'onUnload', 'onReachBottom', 'onPageScroll'];
 var pageEventMethods = ['onBack', 'onKeyboardHeight', 'onOptionMenuClick', 'onPopMenuClick', 'onPullIntercept', 'onPullDownRefresh', 'onTitleClick', 'onTabItemTap', 'beforeTabItemTap'];
-export default function setupPage(arg1, arg2) {
-  var dftData = undefined;
-  var fn = undefined;
+var PAGE_SETUP_ID_KEY = '$$pageSetupId';
+export default function setupPage(fn) {
+  var options = {};
+  var oldData = options.data;
 
-  if (typeof arg2 === 'function') {
-    dftData = arg1;
-    fn = arg2;
-  } else {
-    fn = arg1;
-  }
+  options.data = function () {
+    var _this = this;
 
-  var view;
+    var finalData = {};
 
-  var BizPageStore = /*#__PURE__*/function (_PageStore) {
-    _inherits(BizPageStore, _PageStore);
+    if (oldData) {
+      finalData = typeof oldData === 'function' ? oldData() : oldData;
+    } // Create the setup instance.
 
-    var _super = _createSuper(BizPageStore);
 
-    function BizPageStore() {
-      var _this;
+    var pageSetupId = _uniqueId('page-setup-');
 
-      _classCallCheck(this, BizPageStore);
+    finalData[PAGE_SETUP_ID_KEY] = pageSetupId;
+    var setup = new PageSetup();
+    setupManager.add(pageSetupId, setup); // Execute the setup function.
 
-      _this = _super.call(this);
+    setup.executeSetupFunction(fn);
+    var compositionData = setup.compositionState;
 
-      _defineProperty(_assertThisInitialized(_this), "stopWatchDeepList", []);
+    if (compositionData) {
+      finalData = _typeof(finalData) === 'object' ? _objectSpread(_objectSpread({}, finalData), _cloneDeep(compositionData)) : _cloneDeep(compositionData);
+    } // Set the component instance.
 
-      var setup = view.$setup;
-      setup.wrap(function () {
-        _this.stopWatchDeepList = integrateSetupFunctionResult(fn, setup, view, _assertThisInitialized(_this));
-      });
-      return _this;
-    }
 
-    _createClass(BizPageStore, [{
-      key: "fetchInitData",
-      value: function () {
-        var _fetchInitData = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime.mark(function _callee() {
-          var fn;
-          return _regeneratorRuntime.wrap(function _callee$(_context) {
-            while (1) {
-              switch (_context.prev = _context.next) {
-                case 0:
-                  _context.next = 2;
-                  return _get(_getPrototypeOf(BizPageStore.prototype), "fetchInitData", this).call(this);
+    setup.setViewInstance(this); // Mount the instance methods.
 
-                case 2:
-                  fn = view.$setup.getFetchInitDataMethod();
-                  _context.t0 = fn;
+    setup.iterateInstanceMethods(function (fns, name) {
+      appendFn(_this, name, fns);
+    }); // Watch the reactive data.
 
-                  if (!_context.t0) {
-                    _context.next = 7;
-                    break;
-                  }
+    setup.watchReactiveData(); // Init loading
 
-                  _context.next = 7;
-                  return fn();
+    var initFn = setup.getFetchInitDataMethod();
 
-                case 7:
-                case "end":
-                  return _context.stop();
-              }
-            }
-          }, _callee, this);
-        }));
+    var initCompleteHandler = function initCompleteHandler() {
+      setup.compositionState.isInitLoading = false;
+    };
 
-        function fetchInitData() {
-          return _fetchInitData.apply(this, arguments);
-        }
+    Promise.resolve(initFn && initFn()).then(initCompleteHandler, initCompleteHandler);
+    return finalData;
+  };
 
-        return fetchInitData;
-      }()
-    }, {
-      key: "destroy",
-      value: function destroy() {
-        _get(_getPrototypeOf(BizPageStore.prototype), "destroy", this).call(this);
+  _attachLogic(options, 'onLoad', 'before', function (query) {
+    var _this$data;
 
-        this.stopWatchDeepList.forEach(function (stop) {
-          return stop();
-        });
-        this.stopWatchDeepList = [];
-      }
-    }]);
+    var setup = setupManager.get((_this$data = this.data) === null || _this$data === void 0 ? void 0 : _this$data[PAGE_SETUP_ID_KEY]);
 
-    return BizPageStore;
-  }(PageStore);
+    if (!setup) {
+      return;
+    }
 
-  BizPageStore = __decorate([_observable], BizPageStore);
-  var options = {};
+    setup.isSyncDataSafe = true;
+    setup.query.data = query;
+  }); // Mount the lifecycle methods.
 
-  if (dftData) {
-    options.data = dftData;
-  }
 
-  options = createPage(BizPageStore, options, {
-    beforeCreateStore: function beforeCreateStore(v) {
-      var setup = new PageSetup();
-      v.$setup = setup;
-      view = v;
-      setup.query = view.$query;
-      setup.iterateMethods(function (fns, name) {
-        appendFn(v, name, fns);
-      });
-    }
-  });
+  function integrateLifeCycleMethods(lifeCycleMethods) {
+    return lifeCycleMethods.reduce(function (prev, cur) {
+      prev[cur] = function () {
+        var _this$data2;
 
-  _attachLogic(options, 'onLoad', 'before', function (query) {
-    this.$query = query;
-  });
+        var setup = setupManager.get((_this$data2 = this.data) === null || _this$data2 === void 0 ? void 0 : _this$data2[PAGE_SETUP_ID_KEY]);
 
+        if (!setup) {
+          return;
+        }
+
+        for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
+          args[_key] = arguments[_key];
+        }
+
+        return setup.executeLifeCycleFns.apply(setup, [cur].concat(args));
+      };
+
+      return prev;
+    }, {});
+  }
+
   var lifeCycleMethodsOptions = integrateLifeCycleMethods(lifeCycleMethods);
   lifeCycleMethods.forEach(function (m) {
     _attachLogic(options, m, 'after', lifeCycleMethodsOptions[m]);
-  });
+  }); // Mount the page event methods.
+
   var pageEventMethodsOptions = integratePageEventMethods(pageEventMethods);
@@ -157,4 +110,12 @@ pageEventMethods.forEach(function (m) {
     _attachLogic(options.events, m, 'after', pageEventMethodsOptions[m]);
+  }); // Destroy
+
+  _attachLogic(options, 'onUnload', 'after', function () {
+    var _this$data3;
+
+    var setup = setupManager.get((_this$data3 = this.data) === null || _this$data3 === void 0 ? void 0 : _this$data3[PAGE_SETUP_ID_KEY]);
+    setup === null || setup === void 0 ? void 0 : setup.destroy();
   });
+
   return options;
 }

lib/useAppLifeCycle.js

@@ -5,4 +5,9 @@ import checkSetupEnv from './checkSetupEnv';
   checkSetupEnv('useAppLifeCycle', ['app']);
-  var setup = AppSetup.getCurrent();
-  setup.addMethod(name, fn);
+  var setup = AppSetup.getCurrent(); // Treat the `onShareAppMessage` to an instance member.
+
+  if (name === 'onShareAppMessage') {
+    setup.addInstanceMethod('onShareAppMessage', fn);
+  } else {
+    setup.addMethod(name, fn);
+  }
 }

lib/useAutorun.d.ts

@@ -1,1 +0,1 @@
-export default function useAutorun(): (fn: import("@goldfishjs/reactive").AutorunFunction, errorCb?: import("@goldfishjs/reactive").IErrorCallback | undefined) => import("@goldfishjs/reactive-connect/lib/Store").UnAutorun;
+export default function useAutorun(): (fn: import("@goldfishjs/reactive").AutorunFunction, errorCb?: import("@goldfishjs/reactive").IErrorCallback | undefined) => import("./setup/CommonSetup").UnAutorun;

lib/useAutorun.js

@@ -8,20 +8,8 @@ import useContextType from './useContextType';
 
-  if (type === 'app') {
-    var store = CommonSetup.getCurrent().getStoreInstance();
-    return store.autorun.bind(store);
+  if (['app', 'page', 'component'].indexOf(type) > -1) {
+    var setup = CommonSetup.getCurrent();
+    return setup.autorun.bind(setup);
   }
 
-  if (type === 'page') {
-    var _store = CommonSetup.getCurrent().getStoreInstance();
-
-    return _store.autorun.bind(_store);
-  }
-
-  if (type === 'component') {
-    var _store2 = CommonSetup.getCurrent().getStoreInstance();
-
-    return _store2.autorun.bind(_store2);
-  }
-
   throw new Error('Unknown context.');
 }

lib/useInitDataReady.js

@@ -1,9 +0,22 @@
-import getAppStore from './getAppStore';
 import checkSetupEnv from './checkSetupEnv';
+import CommonSetup from './setup/CommonSetup';
+import useWatch from './useWatch';
 export default function useInitDataReady() {
   checkSetupEnv('useInitDataReady', ['app', 'page', 'component']);
-  var appStore = getAppStore();
+  var watch = useWatch();
+  var setup = CommonSetup.getCurrent();
   return function () {
-    return appStore.waitForInitDataReady();
+    return new Promise(function (resolve) {
+      var stop = watch(function () {
+        return setup.compositionState.isInitLoading;
+      }, function (isLoading) {
+        if (isLoading) {
+          resolve();
+          stop();
+        }
+      }, {
+        immediate: true
+      });
+    });
   };
 }

lib/usePageLifeCycle.js

@@ -5,4 +5,9 @@ import PageSetup from './setup/PageSetup';
   checkSetupEnv('usePageLifeCycle', ['page']);
-  var setup = PageSetup.getCurrent();
-  setup.addMethod(name, fn);
+  var setup = PageSetup.getCurrent(); // Treat the `onShareAppMessage` to an instance member.
+
+  if (name === 'onShareAppMessage') {
+    setup.addInstanceMethod('onShareAppMessage', fn);
+  } else {
+    setup.addMethod(name, fn);
+  }
 }

lib/useProps.js

@@ -6,4 +6,3 @@ import checkSetupEnv from './checkSetupEnv';
   var setup = ComponentSetup.getCurrent();
-  var store = setup.getStoreInstance();
-  return store.props;
+  return setup.props;
 }

lib/useReady.d.ts

@@ -1,1 +0,1 @@
-export default function useReady(): () => Promise<void>;
+export { default } from './useInitDataReady';

lib/useReady.js

@@ -1,9 +0,1 @@
-import getAppStore from './getAppStore';
-import checkSetupEnv from './checkSetupEnv';
-export default function useReady() {
-  checkSetupEnv('useReady', ['app', 'page', 'component']);
-  var appStore = getAppStore();
-  return function () {
-    return appStore.waitForInitDataReady();
-  };
-}
+export { default } from './useInitDataReady';

lib/useWatch.js

@@ -8,20 +8,8 @@ import useContextType from './useContextType';
 
-  if (type === 'app') {
-    var store = CommonSetup.getCurrent().getStoreInstance();
-    return store.watch.bind(store);
+  if (['app', 'page', 'component'].indexOf(type) > -1) {
+    var setup = CommonSetup.getCurrent();
+    return setup.watch.bind(setup);
   }
 
-  if (type === 'page') {
-    var _store = CommonSetup.getCurrent().getStoreInstance();
-
-    return _store.watch.bind(_store);
-  }
-
-  if (type === 'component') {
-    var _store2 = CommonSetup.getCurrent().getStoreInstance();
-
-    return _store2.watch.bind(_store2);
-  }
-
   throw new Error('Unknown context.');
 }

package.json

 {
   "name": "@goldfishjs/composition-api",
-  "version": "2.4.2",
+  "version": "2.5.0",
   "description": "goldfish-composition-api",
@@ -17,6 +17,6 @@ "main": "lib/index.js",
   "dependencies": {
-    "@goldfishjs/module-usage": "^2.4.2",
-    "@goldfishjs/reactive": "^2.4.2",
-    "@goldfishjs/reactive-connect": "^2.4.2",
-    "@goldfishjs/utils": "^2.4.2",
+    "@goldfishjs/module-usage": "^2.5.0",
+    "@goldfishjs/reactive": "^2.5.0",
+    "@goldfishjs/reactive-connect": "^2.5.0",
+    "@goldfishjs/utils": "^2.5.0",
     "mini-types": "^0.1.3"
@@ -23,0 +23,0 @@ },

No alert changes

Worsened metrics

Total package byte prevSize

64064

decreased by-23.62%

Number of package files

64

decreased by-25.58%

Lines of code

1300

decreased by-23.39%

Dependency changes

• Updated@goldfishjs/module-usage@^2.5.0

• Updated@goldfishjs/reactive@^2.5.0

• Updated@goldfishjs/reactive-connect@^2.5.0

• Updated@goldfishjs/utils@^2.5.0