fix: keep this value in functions

KevinBLT · Jan 11, 2024 · 7e0d688 · 7e0d688
1 parent 44a807b
commit 7e0d688
Show file tree

Hide file tree

Showing 2 changed files with 54 additions and 1 deletion.
diff --git a/packages/@hec.js/ui/example/classes/index.html b/packages/@hec.js/ui/example/classes/index.html
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>hec.js :: Classes</title>
+  </head>
+  <body>
+
+    <ul>
+      <li data-for="let e of list">Person: {{ e.name }}, {{ e.age }}yo</li>
+    </ul>
+
+    <script type="module">
+      import { templateByNode } from '../../lib/index.js';
+
+      class Person {
+        name = '';
+        birthYear = 0;
+
+        get age() {
+          return new Date().getFullYear() - this.birthYear;
+        }
+
+        constructor(name, birthYear) {
+          this.name = name;
+          this.birthYear = birthYear;
+        }
+      }
+
+      templateByNode(document.body, {
+        list: [
+          new Person('Joey', Math.round(1970 + Math.random() * 40)),
+          new Person('Pascal', Math.round(1970 + Math.random() * 40)),
+          {
+            name: 'Claudia',
+            birthYear: Math.round(1970 + Math.random() * 40),
+            age() {
+              return new Date().getFullYear() - this.birthYear;
+            }
+          }
+        ],
+      });
+
+    </script>
+  </body>
+</html>
diff --git a/packages/@hec.js/ui/lib/src/props.js b/packages/@hec.js/ui/lib/src/props.js
@@ -77,7 +77,13 @@ export function prop(props, key) {
     } else if (typeof props === 'function') {
       props = f(props);
     } else if (typeof props[p] !== 'undefined') {
-      props = props[p];
+
+      if (typeof props[p] === 'function' && !isSignal(props[p])) {
+        props = props[p].bind(props);
+      } else {
+        props = props[p];
+      }
+
     } else {
       return null;
     }