Dart 如何使用子组件中的“删除”按钮删除子组件

我有一个电子邮件组件email-tag.html，它由一个标签、一个select和一个delete按钮元素组成

email-tag.html组件位于其父级email-view-tag.html中。email视图标记包含一个addemail按钮，每次单击该按钮时，该按钮都会将email标记元素添加到DOM中

我需要帮助删除添加的电子邮件标签组件时，其删除按钮被单击。包含应删除的删除按钮的公司

这两个组成部分如下所示：

email-tag.html

.主伸缩容器 { 显示器：flex； 柔性流：行换行； 调整内容：灵活启动； } 上校 { 显示器：flex； 柔性流动：柱； 调整内容：灵活启动； 柔性生长：1； } {{email}} 删去 进口“包装：聚合物/聚合物.省道”显示客户标签，聚合物相关； 导入“dart:html”显示事件，节点； @自定义标记“电子邮件标记” 类EmailElement扩展了聚合关系 { //@可观察 EmailElement.created:super.created； 列出电子邮件=[，'家庭'，'个人'，'私人'，'工作'，]； void deletePhone事件e、变量详细信息、节点目标 { //shadowRoot.querySelector'new-phone'。删除； //打印“删除当前行”； } } email-view-tag.html

.主伸缩容器 { 显示器：flex； 柔性流：行换行； 调整内容：灵活启动； } 上校 { 显示器：flex； 柔性流动：柱； 调整内容：灵活启动； 柔性生长：1； } 添加电话 -> 进口“包装：聚合物/聚合物.省道”显示客户标签，聚合物相关； 导入“dart:html”显示事件、节点、元素； @自定义标记“电子邮件查看标记” 类EmailViewElement扩展了聚合关系 { //@可观察 EmailViewElement.created:super.created； void addPhone事件e、变量详细信息、节点目标 { $['rows'].children.add new Element.tag'email tag'； } @凌驾 附空{ 附后； $['添加电子邮件btn']。单击； } } 应用程序不会正常执行，单击add按钮会添加电子邮件组件。“删除”按钮不起作用-我在这里寻求帮助

谢谢

编辑 @ShailenTuli关于封装不应该被破坏的观点是正确的

但是JS聚合元素也可以访问布局元素中的父元素，因为在某些场景中仍然很方便

这在PolymerDart中也适用

此.parentNode作为ShadowRoot.host 原创的

您可以触发事件并使电子邮件视图标记侦听此标记，事件处理程序可以从其子对象中删除事件目标

不久前我有一个类似的问题：

这其实是我想提的问题 但第一个可能也有一些用处

附件目前仍在Dart中命名为enteredView，但可能很快将被重命名

子组件不应删除自身。相反，它应该通过调度一个自定义事件，将该职责委托给父组件email view标记

以下是从deletePhone发送自定义事件的代码：

void deletePhone事件e、变量详细信息、节点目标{ dispatchEventnew CustomEvent“不需要”； } 然后，在父级中，更改添加s的代码，如下所示：

void addPhone事件e、变量详细信息、节点目标{ $['rows'].children.add新元素.tag'email-tag'； $['rows'].on[notneeded].listenEvent e{ e、 目标为元素。删除； }; }

---

另外，我会更改deletePhone的名称，因为该方法不再删除记录，而只是通知父级不需要它。称之为“不需要”或类似的东西

谢谢ZOechi。我对飞镖项目不太熟悉。请您添加一些代码来演示我的组件。我还是要深入研究这些事件。谢谢你，图利，当然。如果你觉得答案对你有用，你介意接受吗？当然，图利，答案正是我想要的。再次感谢。你能接受这个答案吗？你可以点击问题左上角的复选标记，谢谢。