From 353798a8a03c15653a9e23e4ea2945c61ad6508b Mon Sep 17 00:00:00 2001
From: brightzhli <864345220@qq.com>
Date: Wed, 12 Feb 2025 15:44:20 +0800
Subject: [PATCH] =?UTF-8?q?test(mobx):=20=E6=B7=BB=E5=8A=A0mobx=E7=A4=BA?=
 =?UTF-8?q?=E4=BE=8B=E5=AD=90=E7=BB=84=E4=BB=B6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/button/_example/mobx.tsx      |  3 ++-
 src/button/_example/mobxChild.tsx | 23 +++++++++++++++++++++++
 2 files changed, 25 insertions(+), 1 deletion(-)
 create mode 100644 src/button/_example/mobxChild.tsx

diff --git a/src/button/_example/mobx.tsx b/src/button/_example/mobx.tsx
index cdf4698..8b6b18e 100644
--- a/src/button/_example/mobx.tsx
+++ b/src/button/_example/mobx.tsx
@@ -1,6 +1,7 @@
 import 'tdesign-web-components/button';
 import 'tdesign-web-components/space';
 import 'tdesign-web-components/input';
+import './mobxChild';
 
 import { autorun } from 'mobx';
 import { Component } from 'omi';
@@ -22,7 +23,6 @@ export default class TestMobx extends Component {
     });
   };
 
-  // 使用autorun来响应状态变化
   installed() {
     console.log('installed');
     autorun(() => {
@@ -39,6 +39,7 @@ export default class TestMobx extends Component {
         </t-button>
         <t-input value={myStore.message} onChange={this.inputChange} />
         {myStore.message}
+        <t-mobx-child />
       </t-space>
     );
   }
diff --git a/src/button/_example/mobxChild.tsx b/src/button/_example/mobxChild.tsx
new file mode 100644
index 0000000..63bb9d9
--- /dev/null
+++ b/src/button/_example/mobxChild.tsx
@@ -0,0 +1,23 @@
+import 'tdesign-web-components/button';
+import 'tdesign-web-components/space';
+
+import { autorun } from 'mobx';
+import { Component, tag } from 'omi';
+
+import { myStore } from '../store';
+
+@tag('t-mobx-child')
+export default class TestMobxChild extends Component {
+  // 子组件的autorun可以注掉
+  installed() {
+    // 如果父子组件都调了autorun，会多次触发，看是否优化
+    autorun(() => {
+      this.update();
+      console.log('子组件触发autorun');
+    });
+  }
+
+  render() {
+    return <t-space>mobx子组件：{myStore.message}</t-space>;
+  }
+}