gpt4 book ai didi

dart - 是否曾经调用过WebComponent.removed()?

转载 作者:行者123 更新时间:2023-12-03 03:11:00 25 4
gpt4 key购买 nike

在重写了WebComponent的三个生命周期方法:created()inserted()removed()之后,我可以看到前两个被一致地调用,但是从未调用过removed()。有什么特别的事情需要做才能调用removed()吗?还是根本就不称呼它?

最佳答案

从DOM中删除自定义元素时,将调用removed()方法。这是一个小程序,演示created()inserted()removed()生命周期事件的用法。

使用如下的index.html文件创建Dart Web应用程序:

<!DOCTYPE html>

<html>
<head>
<title>index</title>
<link rel="import" href="my_element.html">
<script src="packages/polymer/boot.js"></script>
</head>

<body>
<div id='container'><my-element></my-element></div>
<script type="application/dart">
import 'dart:html';
void main() {
query('#container').onClick.listen((event) {
event.target.remove();
});
}
</script>
</body>
</html>

该文件导入并显示一个自定义元素 <my-element>

定义以下定义 <my-element>的文件:

<!DOCTYPE html>

<html>
<body>
<polymer-element name="my-element">
<template>
<p>The name is {{person.name}}</p>
</template>

<script type="application/dart" src="my_element.dart"></script>
</polymer-element>
</body>
</html>

并定义随附的Dart文件,该文件演示了如何调用生命周期方法:

import 'package:polymer/polymer.dart';

class Person extends Object with ObservableMixin {
@observable String name;
Person(this.name);
}

@CustomTag("my-element")
class MyElement extends PolymerElement {
@observable Person person = new Person('Shailen');

void created() {
super.created();
print('created');
}

void inserted() {
print('inserted');
}

void removed() {
print('removed');
}
}

运行 index.html时,您会看到一个带有一些文本的段落。调用 created()inserted()生命周期方法,并在控制台中打印“创建”和“插入”消息。当您单击包含自定义元素的div时,该元素将被删除, removed()生命周期方法将被调用,并在控制台中显示“removed”。

希望这可以帮助。

关于dart - 是否曾经调用过WebComponent.removed()?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18470383/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com