【问题标题】:Element reuse with Dart Polymer使用 Dart Polymer 重复使用元素
【发布时间】:2014-03-20 06:51:48
【问题描述】:

命题:

天,我有一个问题要问集体智慧信任。我在尝试解决 Dart 和 Dart-Polymer 的一个神秘错误时进行了观察(请参阅:related)。

我遇到的事情与(和)元素有关;在调查上述错误期间,我创建了两个克隆的 元素:

  1. <x-fred>
  2. <z-fred>

两者都是 示例中Stopwatch 元素的克隆。

与原始版本的唯一变化是元素名称。

我想到的是,为了能够 一个不错的'stock element',例如stopwatch,我至少需要一个独特的 fred。 html 为每个元素 I

前提是我可以组织我的项目,使其方便且易于维护。

问题:

真正的问题是开发人员如何做以下事情...?

  1. 元素布局定义,无需克隆(或复制)。
  2. 是否有 模式(至少)允许项目 克隆 元素的基本 代码?
  3. 有没有办法 元素定义,使用 declarative 或 "what-not-how" 模式,所以我可以说:
    • <z-fred> is-a 秒表元素(例如)。
  4. 是否有模式或配方可让您成为一个 秒表元素并配置和/或自定义特定样式的实例,参数或行为。

如果没有,那么这些事情需要被搁置讨论。 和 [dart:polymer] 发生在哪里?有 comp.lang.dart 吗? :-)

示例:

假设我有一个名为 <z-fred> 的 Polymer 元素。我想对 z-fred 元素进行子类化以生成新的 (daughter) 元素定义:<x-fred>

我该怎么做?

我希望能够做到...

  <!DOCTYPE html>
  <polymer-element name="x-fred">

    <link rel="import"     href="elements/zfred/fred.html">

    <template>
      <style>
        :host {  /* override zfred defiitions */
            background-color: blue;
            text-align: center;
            display: inline-block;
            border: solid 1px;
            padding: 10px 10px 10px 10px;
        }
      </style>
      <div>
        <x-fred> 
          <h1>X-Fred: {{counter}} </h1>
          <p>Fred X is a count-down timer.  Fred Z is a normal stopwatch (count-up).</p>
          <override>
            <button on-click="{{stop}}"  id="stopXFredButton">Stop</button>
          </override>
        </x-fred>
        <div>
           <p>this is a count-down timer.  Remaining time at end: {{ counter }} </p>
        </div>
      </div>
    </template>

    <script type="application/dart" src="xfred.dart">  </script>

  </polymer-element>

看到了吗?我的示例不起作用,因为这里需要 XFred.polymer 从 ZFred.polymer 继承。

也就是说,我没有看到将 .html 和 .dart 绑定到类似的“元素模块”中。以我的小方式,我想通过将每个小部件放在自己的文件夹中来做到这一点。为此(并且会有更好的机制),daughter 需要能够覆盖父级 Public 和 Protected 属性(不是私有的)。

我在想 xfred.dart 会隐式继承 zfred.dart (因为词法上)这两个 Dart 文件都与 Polymer 元素无关。在这个关头,有一些产品设计问题需要探讨。像这样的选项:

  1. HTML 文件对 .Dart 文件具有独立的继承树。
    • 这意味着根据各种示例,zfred 和 xfred 可能使用(共享)相同的底层实现。
    • 或者,可以“调用”已定义接口的合适 .Dart 实现。
  2. 由 .html 和 .dart 代码规范组成的混合“widget”元素。

在真实的用户界面中,我可能希望将各种基本 UI 元素组合成不同种类的子元素,以构成页面、表单或布局。我认为遵循 concept #1 的生活不会那么混乱。这满足了我的另一个要求,即能够管理同一元素的替代代码隐藏行为。

在一天结束的时候。我要问的主要问题是框架的一部分有多少,手动黑客工作有多少才能确保事情保持愉快? :-)

【问题讨论】:

  • 您好,请不要在任何地方使用标签。这使您的问题很难阅读。
  • 您能否添加一些代码来演示您尝试实现的目标。不必工作,但它使讨论(提出问题)变得更加容易。您删除引用的问题是否有特定原因,或者只是链接损坏?

标签: dart dart-polymer dart-polymer code-reuse dart-polymer dart-polymer code-reuse code-reuse code-reuse dart-polymer code-reuse dart dart-polymer code-reuse dart oop dart code-reuse dart-polymer


【解决方案1】:

【讨论】:

  • 该示例仅继承自 Dart 对象。我认为我的问题应该是:“继承一个小部件”。哪个是设计(.HTML)加上行为(.Dart)
  • 我没试过,但是你可以多次应用注解。也许它可以添加 @CustomTag 注释。
猜你喜欢
  • 2014-06-21
  • 1970-01-01
  • 2014-02-18
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-08-31
  • 2015-07-16
  • 2014-02-20
相关资源
最近更新 更多