1

我用 web-ui 创建了一个新的 web 应用程序。所有软件包似乎都已正确安装。我运行了生成的“点击计数器”示例，但它没有出现。我去了Web-UI文章并粘贴了这段代码：

<!DOCTYPE html>
<!--
Copyright (c) 2012, 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">

</head>
<body>
  <element name="x-click-counter" constructor="CounterComponent" extends="div">
    <template>
      <button on-click="increment()">Click me</button>
      <span>(click count: {{count}})</span>
    </template>
    <script type="application/dart">
      import 'package:web_ui/web_ui.dart';

      class CounterComponent extends WebComponent {
        int count = 0;
        void increment() { count++; }
      }
    </script>
  </element>
  <div class="well">
    <div is="x-click-counter" count="{{myNumber}}"></div>
    <div is="x-click-counter" count="{{5}}"></div>
  </div>
  <script type="application/dart">
    int myNumber = 12;
    main(){}
  </script>
</body>
</html>

但这也没有用。代码有问题吗？它已经过时了吗？是否有一些我没有考虑的依赖？

4

1 回答 1

1

该代码对我来说很好。

你先跑build.dart吗？您不能直接运行此脚本并使其工作。您应该有一个看起来像这样的顶级build.dart文件（我假设该文件位于web/目录中并被调用click_counter.html）：

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

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

当您运行此文件时，out/将为您自动生成一个目录。右键单击目录click_counter.html中的文件out/，然后运行它。它应该工作。

您可以在http://www.dartlang.org/articles/web-ui/tools.html阅读有关编译过程的更多信息。

于 2013-04-06T14:15:35.430 回答