如何获取WebComponent类来调用我的自定义构造函数? [英] How do I get WebComponent classes to invoke my custom constructor?

查看:302
本文介绍了如何获取WebComponent类来调用我的自定义构造函数?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我创建了一个WebComponent,我为它创建了一个构造函数。当运行时,这个构造函数似乎没有被调用,虽然其余的组件工作,但他们必须在我的自定义构造函数之外创建。这里是我在说什么的例子。

I created a WebComponent where I created a constructor for it. When run, this constructor does not seem to be invoked, though the rest of the components work, but they have to be created outside my custom constructor. Here is an example of what I'm talking about.

<element name="x-navigation" constructor="Navigation" extends="div">
    <template>
        <div>{{items}}</div>
    </template>
    <script type="application/dart">
        import 'package:web_ui/web_ui.dart';

        class Navigation extends WebComponent {
          List<String> items = new List<String>();
          Navigation() {
              items.add("Hello");
          }
        }
    </script>
<element>

如果我包含这个组件,输出将是一个空列表,就像我创建的构造函数没有被调用。应该至少有Hello字符串输出,但它不是。

If I include this component, the output will be an empty list, as if the constructor I created has not been called. There should be at least the "Hello" string output, but it isn't. Are constructors created this way ignored, or have I missed something?

推荐答案

最新版本的Web UI现在调用构造函数,而且还有创建的生命周期方法。

The latest version of Web UI now calls the constructor, and there is also the created lifecycle method available for you.

以下代码添加了两个hello:

The following code is adding both hello's:

<element name="x-navigation" constructor="Navigation" extends="div">
  <template>
    <div>{{items}}</div>
  </template>

  <script type="application/dart">
    import 'package:web_ui/web_ui.dart';

    class Navigation extends WebComponent {
      List<String> items = new List<String>();

      Navigation() {
        items.add("Hello first");
      }

      created() {
        items.add("Hello second");
      }
    }
  </script>
<element>

我建议阅读关于生命周期方法的文章: http://www.dartlang.org/articles/dart-web-components/spec.html#lifecycle-methods

I recommend reading the article on lifecycle methods: http://www.dartlang.org/articles/dart-web-components/spec.html#lifecycle-methods

created

created() - Invoked slightly after a component is created.

inserted() - 每当将组件添加到DOM时调用。

inserted() - Invoked whenever a component is added to the DOM.

attributeChanged() - 在组件中的某个属性发生更改时调用。

attributeChanged() - Invoked whenever an attribute in the component changes.

> - 当从DOM中删除组件时调用

removed() - Invoked whenever a component is removed from the DOM

这篇关于如何获取WebComponent类来调用我的自定义构造函数?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆