init

Author: maomincoding

doc/.vitepress/cache/deps/_metadata.json

@@ -1,25 +1,25 @@
 {
-  "hash": "34652ad1",
-  "configHash": "09913fa0",
+  "hash": "18e6f8c7",
+  "configHash": "891b3535",
   "lockfileHash": "a0e730cd",
-  "browserHash": "4004c618",
+  "browserHash": "46dd3ae7",
   "optimized": {
     "vue": {
       "src": "../../../../node_modules/.pnpm/vue@3.5.13/node_modules/vue/dist/vue.runtime.esm-bundler.js",
       "file": "vue.js",
-      "fileHash": "c1ab87de",
+      "fileHash": "e2656c28",
       "needsInterop": false
     },
     "vitepress > @vue/devtools-api": {
       "src": "../../../../node_modules/.pnpm/@vue+devtools-api@7.6.4/node_modules/@vue/devtools-api/dist/index.js",
       "file": "vitepress___@vue_devtools-api.js",
-      "fileHash": "f58f77c0",
+      "fileHash": "7d8b133b",
       "needsInterop": false
     },
     "vitepress > @vueuse/core": {
       "src": "../../../../node_modules/.pnpm/@vueuse+core@11.2.0_vue@3.5.13/node_modules/@vueuse/core/index.mjs",
       "file": "vitepress___@vueuse_core.js",
-      "fileHash": "40c46c9f",
+      "fileHash": "6191dd33",
       "needsInterop": false
     }
   },

doc/en/changeLog/index.md

@@ -1,6 +1,6 @@
 # Change Log
 
-## v1.1.0 (Latest)
+## v1.1.2 (Latest)
 
 - Optimize the underlying code structure.
 

doc/en/essentials/api/index.md

@@ -16,10 +16,9 @@ createApp(<App />, '#app');
 
 ## setData
 
-Modify page data.
+Modifying page data is best performed at the end of the logic.
 
-The first parameter is a function, which must be passed. Execute the callback function to modify the associated page data.
-The second parameter is the context, which must be passed in the outer scope and not in the inner scope.
+The first parameter is the context, which is required in the outer scope but not in the inner scope. In the inner scope, it can be referenced directly in the function component.
 
 **Internal scope:**
 
@@ -28,9 +27,8 @@ function App({ setData }) {
   let count = 0;
 
   function add() {
-    setData(() => {
-      count++;
-    });
+    count++;
+    setData();
   }
 
   return () => (
@@ -50,9 +48,8 @@ import { setData } from 'mettle';
 let count = 0;
 
 function add() {
-  setData(() => {
-    count++;
-  }, App);
+  count++;
+  setData(App);
 }
 
 function App() {
@@ -65,7 +62,7 @@ function App() {
 }
 ```
 
-The third parameter is optional. Its type is `Symbol` and is used with the built-in attribute `$memo` to indicate updated data.
+The second parameter is optional and is of type `Symbol`. It is used with the built-in property `$memo` to indicate updated data.
 
 ## onMounted
 

doc/en/essentials/example/index.md

@@ -6,9 +6,8 @@
 function TwoWay({ setData }) {
   let value = '';
   function useInput(e) {
-    setData(() => {
-      value = e.target.value;
-    });
+    value = e.target.value;
+    setData();
   }
 
   return () => (
@@ -29,9 +28,8 @@ function Son({ setData, content }) {
   };
 
   content.getList = function (val) {
-    setData(() => {
-      props.list = val;
-    });
+    props.list = val;
+    setData();
   };
 
   return () => (
@@ -91,9 +89,8 @@ function Father({ setData }) {
   let msg = '';
 
   Son.getMsg = function (val) {
-    setData(() => {
-      msg = val;
-    });
+    msg = val;
+    setData();
   };
 
   return () => (
@@ -122,14 +119,13 @@ function Timer({ setData }) {
 
   let handle = null;
   function update() {
-    setData(() => {
-      data.elapsed = performance.now() - lastTime;
-      if (data.elapsed >= data.duration) {
-        cancelAnimationFrame(handle);
-      } else {
-        handle = requestAnimationFrame(update);
-      }
-    });
+    data.elapsed = performance.now() - lastTime;
+    if (data.elapsed >= data.duration) {
+      cancelAnimationFrame(handle);
+    } else {
+      handle = requestAnimationFrame(update);
+    }
+    setData();
   }
 
   update();
@@ -160,7 +156,7 @@ function Son({ content, setData }) {
   }
 
   content.update = function () {
-    setData(() => {});
+    setData();
   };
 
   return () => (
@@ -173,18 +169,16 @@ function Son({ content, setData }) {
 
 function Store({ setData }) {
   function getUserInfo() {
-    setData(() => {
-      store.dispatch('fetchUser').then(() => {
-        console.log(store.state.user); // { name: 'John Doe', age: 30 }
-      });
+    store.dispatch('fetchUser').then(() => {
+      console.log(store.state.user); // { name: 'John Doe', age: 30 }
     });
+    setData();
   }
 
   function add() {
-    setData(() => {
-      store.commit('increment');
-      Son.update();
-    });
+    store.commit('increment');
+    Son.update();
+    setData();
   }
 
   return () => (
@@ -287,14 +281,12 @@ function Toast({ setData,content }) {
 
   content.show = (val) => {
     clearTimeout(timer);
-    setData(() => {
-      isShow = true;
-      msg = val;
-    });
+    isShow = true;
+    msg = val;
+    setData();
     timer = setTimeout(() => {
-      setData(() => {
-        isShow = false;
-      });
+      isShow = false;
+      setData();
     }, 2000);
   };
 

doc/en/essentials/usage/index.md

@@ -72,9 +72,8 @@ function App({ setData }) {
   };
 
   function useShow() {
-    setData(() => {
-      state.isShow = !state.isShow;
-    });
+    state.isShow = !state.isShow;
+    setData();
   }
   return () => (
     <fragment>
@@ -96,9 +95,8 @@ function App({ setData }) {
   };
 
   function usePush() {
-    setData(() => {
-      state.arr.push(3);
-    });
+    state.arr.push(3);
+    setData();
   }
   return () => (
     <fragment>
@@ -149,9 +147,8 @@ function MyComponent({ setData }) {
   let count = 0;
 
   function add() {
-    setData(() => {
-      count++;
-    });
+    count++;
+    setData();
   }
 
   return () => (
@@ -166,9 +163,8 @@ function App({setData}) {
   let count = 0;
 
   const add = () => {
-    setData(() => {
-      count++;
-    });
+    count++;
+    setData();
   };
 
   return () => (
@@ -256,9 +252,8 @@ function App({ setData }) {
   let count = 0;
 
   function add() {
-    setData(() => {
-      count++;
-    });
+    count++;
+    setData();
   }
 
   return () => (
@@ -299,13 +294,8 @@ function App({ setData }) {
   function handle(event) {
     const el = event.target;
     const id = Number(el.dataset.id);
-    setData(
-      () => {
-        selected = id;
-      },
-      null,
-      symbol1
-    );
+    selected = id;
+    setData(null,symbol1);
     return false;
   }
 
@@ -343,9 +333,8 @@ function App({setData}) {
   };
 
   function useShow() {
-    setData(() => {
-      state.isShow = !state.isShow;
-    });
+    state.isShow = !state.isShow;
+    setData();
   }
   return () => (
     <fragment>

doc/en/guide/install/index.md

@@ -19,9 +19,8 @@ If you open the above index.html directly in the browser, you will find that it
       let count = 0;
 
       function add() {
-          setData(() => {
-              count++;
-          });
+          count++;
+          setData();
       }
       return () => html`<h1 onClick=${add}>${count}</h1>`;
   }
@@ -45,9 +44,8 @@ All top-level APIs of this version are exposed as properties on the global Mettl
       let count = 0;
 
       function add() {
-          setData(() => {
-              count++;
-          });
+          count++;
+          setData();
       }
       return () => html`<h1 onClick=${add}>${count}</h1>`;
   }

doc/en/guide/started/index.md

@@ -44,9 +44,8 @@ All top-level APIs in this version are exposed as properties on the global Mettl
           let count = 0;
 
           function add() {
-              setData(() => {
-                  count++;
-              });
+              count++;
+              setData();
           }
           return () => html`<h1 onClick=${add}>${count}</h1>`;
       }
@@ -79,9 +78,8 @@ Most modern browsers already support ES modules, so we can use Mettle with CDN a
           let count = 0;
 
           function add() {
-              setData(() => {
-                  count++;
-              });
+              count++;
+              setData();
           }
           return () => html`<h1 onClick=${add}>${count}</h1>`;
       }

doc/en/tool/mettleRouter/index.md

@@ -30,11 +30,10 @@ export default function Home({ setData }) {
   }
 
   function useChange() {
-    setData(() => {
-      state.msg = 'world';
-      state.count++;
-      state.arr.unshift(state.count);
-    });
+    state.msg = 'world';
+    state.count++;
+    state.arr.unshift(state.count);
+    setData();
   }
 
   return () => (

doc/zh/changeLog/index.md

@@ -1,6 +1,6 @@
 # 更新日志
 
-## v1.1.0 (Latest)
+## v1.1.2 (Latest)
 
 - 优化底层代码结构。