fix(reactant-share): fix router init event in reactant-share

Author: unadlib

examples/ts-counter/src/index.tsx

@@ -7,6 +7,7 @@ import {
   useConnector,
   action,
   state,
+  computed,
 } from 'reactant';
 
 @injectable()
@@ -16,13 +17,25 @@ class Counter {
 
   @action
   increase() {
+    console.log('increase0', this.count, this.doubleCount, this.doubleCount1);
     this.count += 1;
+    console.log('increase1', this.count, this.doubleCount, this.doubleCount1);
   }
 
   @action
   decrease() {
     this.count -= 1;
   }
+
+  @computed
+  get doubleCount() {
+    return this.count * 2;
+  }
+
+  @computed((that: Counter) => [that.count])
+  get doubleCount1() {
+    return this.count * 2;
+  }
 }
 
 @injectable()
@@ -33,12 +46,16 @@ class AppView extends ViewModule {
 
   component() {
     const count = useConnector(() => this.counter.count);
+    const doubleCount = useConnector(() => this.counter.doubleCount);
+    const doubleCount1 = useConnector(() => this.counter.doubleCount1);
     return (
       <>
         <button type="button" onClick={() => this.counter.decrease()}>
           -
         </button>
-        <div>{count}</div>
+        <p>{count}</p>
+        <p>{doubleCount}</p>
+        <p>{doubleCount1}</p>
         <button type="button" onClick={() => this.counter.increase()}>
           +
         </button>
@@ -50,6 +67,9 @@ class AppView extends ViewModule {
 const app = createApp({
   main: AppView,
   render,
+  // devOptions: {
+  //   autoComputed: true,
+  // },
 });
 
 app.bootstrap(document.getElementById('root'));

packages/reactant-share/src/modules/router.ts

@@ -67,6 +67,32 @@ class ReactantRouter extends BaseReactantRouter {
       ),
     });
 
+    this.portDetector.onClient(() => {
+      const stopWatching = watch(
+        this,
+        () => this.portDetector.lastAction.action,
+        () => {
+          const action = this.portDetector.lastAction
+            .action as any as LocationChangeAction;
+          if (
+            action.type === LOCATION_CHANGE &&
+            action.payload.isFirstRendering
+          ) {
+            const router = this._routers[this.portDetector.name];
+            if (
+              router &&
+              this.history.createHref(router.location) !==
+                this.history.createHref(this.router!.location)
+            ) {
+              stopWatching();
+              // router reducer @@router/LOCATION_CHANGE event and syncFullState event The events may be out of order, so we re-check route consistency after synchronizing the state.
+              this.history.replace(router.location);
+            }
+          }
+        }
+      );
+    });
+
     if (globalThis.document) {
       window.addEventListener('popstate', () => {
         if (!this.passiveRoute) {