你尚未登录,仅允许查看本站部分内容。请登录使用邀请码注册
IntPtr

X-View - 一个基于 Virtual DOM 与 Web Components 的前端框架 3个回复 专栏 @ 框架与库

IntPtr 发布于 3 年前

https://github.com/lixiaoyan/x-view

var x = require("x-view");

var Button = x.createClass({
  propTypes: {
    text: x.type.string
  },
  render: function() {
    return x.createElement("button", {
      type: "button"
    }, [this.props.text]);
  }
});
x.register("x-button", Button);

x.render(document.body, x.createElement("x-button", {
  text: "Hello!",
  "on-click": function() {
    console.log("You clicked the button!");
  }
}));
  • berg

    没有对web components 里面 HTML 部分的支持?

    @walterShen

    #1
  • IntPtr

    @berg 这个是基于 Shadow DOM 与 Custom Elements 这两个东西的. HTML 中直接写标签也是支持的, 同时也支持 boolean 和 number 的 attribute, 比如 <x-button disabled>text</x-button>. 这个东西整个是基于 document.registerElement() 的. 不过 on-* 在 HTML 中不支持直接书写, 可以通过 ele.addEventListener() 添加监听器, 所有自定义事件的实现也是基于 DOM Event 的, 可以在 component 内调用 this.emit(type, detail) 触发.

    #2
  • berg

    @IntPtr 哈哈,那你这东西就跟我们现在正在做的东西挺像的了~

    #3
登录后回复,如无账号,请使用邀请码注册