如何在dart中创建自定义元素?

缺口

我正在尝试在飞镖中创建自定义元素。它应该只包含2个按钮。它实际上从未在整个构建过程中实现……我在做什么错?

class GraphButton extends Element {
  factory GraphButton() => new Element.tag('GraphButton');
  ButtonElement colorBtn;
  ButtonElement removeBtn;

  GraphButton.created() : super.created() {

  }

  void setup(String buttonText) {
    text = buttonText;
    //initialize color btn
    colorBtn
      ..id = 'colorBtn' + text
      ..text = "colorSelector"
      ..onClick.listen(
          (var e) => querySelector('#output').text = id + 'button clicked!');

//initialize remove button
    removeBtn
      ..id = 'removeBtn' + text
      ..text = 'X'
      ..onClick.listen(
          (var e) => this.remove());

  //add to DOM
  this.children
  ..add(colorBtn)
  ..add(removeBtn);
  }
}
贡特·佐赫鲍尔(GünterZöchbauer)

您的代码中存在一些问题。

  • 自定义元素需要遵循-其名称中必须带有的命名规则
  • 需要注册该元素,以便浏览器能够实例化它们
  • setup(...)未调用您添加方法,因此未向按钮添加标题
  • 自定义元素需要扩展 HtmlElement

DartPad示例

也可以看看:

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何在Go中创建自定义类型元素的自定义类型数组?

来自分类Dev

如何在Polymer.dart中的自定义元素中注册PolymerExpression过滤器?

来自分类Dev

如何在Polymer.dart中的自定义元素中注册PolymerExpression过滤器?

来自分类Dev

如何在Dart中创建自定义霓虹灯动画

来自分类Dev

Dart Polymer:创建时如何在自定义中设置非字符串字段

来自分类Dev

如何在java中动态创建自定义xml元素(或自定义javafx场景控件)

来自分类Dev

Dart自定义元素中的extendTag

来自分类Dev

如何在C ++中从文件创建自定义QML元素?

来自分类Dev

如何在Android中自定义UI大小元素

来自分类Dev

如何在ActiveAdmin gem中创建自定义页面

来自分类Dev

如何在Django中创建自定义选择字段?

来自分类Dev

如何在Android中创建自定义导航抽屉

来自分类Dev

如何在Laravel 4中创建自定义外观

来自分类Dev

如何在Drupal 7中创建自定义块?

来自分类Dev

如何在AngularJs服务中创建自定义事件

来自分类Dev

如何在Moodle中创建自定义表单?

来自分类Dev

如何在C ++中创建自定义整数序列

来自分类Dev

如何在android中创建自定义渐变?

来自分类Dev

如何在AMPL中创建自定义函数?

来自分类Dev

如何在SpriteKit中创建自定义混合模式

来自分类Dev

如何在Nginx中创建自定义位置?

来自分类Dev

如何在C#中创建自定义事件

来自分类Dev

如何在Powershell中创建自定义数组?

来自分类Dev

如何在angular中创建自定义指令

来自分类Dev

如何在Python中创建自定义分组视图?

来自分类Dev

如何在Shopify中创建自定义Web挂钩

来自分类Dev

如何在RMarkdown中创建自定义块?

来自分类Dev

如何在Flutter中创建自定义日历

来自分类Dev

如何在Flutter中创建自定义列表?

Related 相关文章

  1. 1

    如何在Go中创建自定义类型元素的自定义类型数组?

  2. 2

    如何在Polymer.dart中的自定义元素中注册PolymerExpression过滤器?

  3. 3

    如何在Polymer.dart中的自定义元素中注册PolymerExpression过滤器?

  4. 4

    如何在Dart中创建自定义霓虹灯动画

  5. 5

    Dart Polymer:创建时如何在自定义中设置非字符串字段

  6. 6

    如何在java中动态创建自定义xml元素(或自定义javafx场景控件)

  7. 7

    Dart自定义元素中的extendTag

  8. 8

    如何在C ++中从文件创建自定义QML元素?

  9. 9

    如何在Android中自定义UI大小元素

  10. 10

    如何在ActiveAdmin gem中创建自定义页面

  11. 11

    如何在Django中创建自定义选择字段?

  12. 12

    如何在Android中创建自定义导航抽屉

  13. 13

    如何在Laravel 4中创建自定义外观

  14. 14

    如何在Drupal 7中创建自定义块?

  15. 15

    如何在AngularJs服务中创建自定义事件

  16. 16

    如何在Moodle中创建自定义表单?

  17. 17

    如何在C ++中创建自定义整数序列

  18. 18

    如何在android中创建自定义渐变?

  19. 19

    如何在AMPL中创建自定义函数?

  20. 20

    如何在SpriteKit中创建自定义混合模式

  21. 21

    如何在Nginx中创建自定义位置?

  22. 22

    如何在C#中创建自定义事件

  23. 23

    如何在Powershell中创建自定义数组?

  24. 24

    如何在angular中创建自定义指令

  25. 25

    如何在Python中创建自定义分组视图?

  26. 26

    如何在Shopify中创建自定义Web挂钩

  27. 27

    如何在RMarkdown中创建自定义块?

  28. 28

    如何在Flutter中创建自定义日历

  29. 29

    如何在Flutter中创建自定义列表?

热门标签

归档