个人中心
gpt4 book ai didi

dart - 在Dart中动态添加WebComponent？

转载 作者：行者123 更新时间：2023-12-03 02:58:57 25 4
gpt4 key购买 nike

我试图遵循此处找到的代码:

component_created_in_code_test.html

component_created_in_code.dart

但是，当我获得依赖关系并在dartium中运行代码时，出现以下错误。调用ComponentItem的create()方法(在.dart代码中)时，会发生此错误:

Breaking on exception: Class 'SayHello' has no instance method 'created_autogenerated'.

我在下面略微重写了它们(代码是相同的，除了main已移为 Dart 代码而不是内联): 
<!-- component_created_in_code_test.html -->
<!doctype html>
<!--
Copyright (c) 2013, the Dart project authors.  Please see the AUTHORS file
for details. All rights reserved. Use of this source code is governed by a
BSD-style license that can be found in the LICENSE file.
-->
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <script src="packages/web_ui/testing/testing.js"></script>
</head>
<body>
  <element name="say-hello">
    <template>Hello {{name}}!</template>
    <script type='application/dart' src="component_created_in_code.dart">
    </script>
  </element>
  <say-hello name="component create in html"></say-hello>
</body>
</html>

以及以下的镖代码， 
//component_created_in_code.dart

library component_created_in_code;

import 'dart:async';
import 'dart:html';
import 'package:web_ui/web_ui.dart';

class SayHello extends WebComponent {
  String name;
}

void main() {
  Timer.run(() {
    var hello = new SayHello()
    ..host = new DivElement()
    ..name = 'component created in code';

    // "hello" is the DOM node.
    // "hello.xtag" is your SayHello object.
    // We are working on making these be the same object.

    // If the component uses data-binding, we need to make sure the
    // "lifecycle" methods get called. We are working to make this be
    // automatic too.
    var lifecycleCaller = new ComponentItem(hello)..create();
    document.body.nodes.add(hello.host);
    lifecycleCaller.insert();
    window.postMessage('done', '*');
  });
}

似乎此dart-lang示例存在问题。我错过了什么吗？还是代码很枯燥？

在回答了这个问题之后，我打包了该问题的有效解决方案。

component_created_in_code

只需从git中提取，然后导入dartEditor。然后从编辑器中“发布安装”和“重新分析源代码”(从不伤心)，然后在“web / component_created_in_code.html”上右键单击“在Dartium中运行”。

最佳答案

听起来您需要首先运行Web UI编译器。在您的HTML文件上运行packages / web_ui / dwc.dart，或者按照以下方式编写build.dart:

import 'dart:io';
import 'package:web_ui/component_build.dart';

void main() {
  build(new Options().arguments, ['web/component_created_in_code_test.html']);
}

关于dart - 在Dart中动态添加WebComponent？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17006452/

25 4 0
文章推荐： dart - forEach 和 for (var o in objs) 之间的性能差异
文章推荐： django - 如何给选项标签添加属性？
文章推荐： 卡西尼号上的 ASP.NET MVC : How can I force the "content" directory to return 304s instead of 200s?
文章推荐： dart - Dart中类似Maven的结构似乎不可能
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com