ryansolid / dom-expressions

A Fine-Grained Runtime for Performant DOM Rendering
MIT License
850 stars 122 forks source link

Fix `this` compilation #295

Closed lxsmnsyc closed 8 months ago

lxsmnsyc commented 8 months ago

Example:

class Example {
  template = () => (
    <this.H1
      onClick={() => this.foo()}
      onLoad={(function () {
        console.log(this)
      }).bind({ foo: 'bar' })}
    >
      <h1 onClick={() => this.bar()}>{this.title}</h1>
      <this.Child onClick={() => this.bar()}>{this.title}</this.Child>
    </this.H1>
  )
}

Output:

var _client = require("../../src/client");
const _tmpl$ = /*#__PURE__*/(0, _client.template)(`<h1>`);
class Example {
  template = () => {
    const _self$ = this;
    return (0, _client.createComponent)(this.H1, {
      onClick: () => _self$.foo(),
      get onLoad() {
        return function () {
          console.log(this);
        }.bind({
          foo: 'bar'
        });
      },
      get children() {
        return [(() => {
          const _el$ = _tmpl$();
          _el$.$$click = () => _self$.bar();
          (0, _client.insert)(_el$, () => _self$.title);
          return _el$;
        })(), (0, _client.createComponent)(_self$.Child, {
          onClick: () => _self$.bar(),
          get children() {
            return _self$.title;
          }
        })];
      }
    });
  };
}
(0, _client.delegateEvents)(["click"]);