Question

我想实现一个枚举：枚举可见性=可见|隐藏|折叠

我希望能够在HTML代码中设置它。有一些魔术允许编译器解析HTML中的字符串属性值，如1到int，true到bool等。有没有办法可以让我自己的类可以从字符串中解析？

Answer 1

Dart尚未对枚举提供正式支持。我们希望将来添加枚举：http://news.dartlang.org/2013/04/enum-proposal-for-dart.html

与此同时，这是一个模拟枚举的常用模式：

class Enum {
  final _value;
  const Enum._internal(this._value);
  toString() => 'Enum.$_value';

  static const FOO = const Enum._internal('FOO');
  static const BAR = const Enum._internal('BAR');
  static const BAZ = const Enum._internal('BAZ');
}

来自How can I build an enum with Dart?

要创建具有枚举字段的Web UI自定义元素，您可以使用setter和getters将字符串（从HTML）转换为枚举。

这样的事情应该有效：

import 'package:web_ui/web_ui.dart';

class Color {
  final _value;
  const Color._internal(this._value);
  factory Color(String value) {
    switch (value) {
      case 'RED':
        return Color.RED;
      case 'BLUE':
        return Color.BLUE;
      case 'GREEN':
        return Color.GREEN;
      default:
        throw 'not a color';
    }
  }
  toString() => 'Color.$_value';

  static const RED = const Color._internal('RED');
  static const BLUE = const Color._internal('BLUE');
  static const GREEN = const Color._internal('GREEN');
}

class PersonComponent extends WebComponent {
  Color favoriteColor;

  String get favColor => ((x) => x == null ? null : x._value)(favoriteColor);

  void set favColor(String value) {
    favoriteColor = new Color(value);
  }
}

然后HTML将是：

<html>
  <body>   
    <element name="x-person" extends="div" constructor="PersonComponent">
      <template>
        <div>
          Favorite Color: <select bind-value="favColor">
            <option>RED</option>
            <option>GREEN</option>
            <option>BLUE</option>
          </select>
        </div>
        <div>
          You picked {{favoriteColor}}
        </div>
      </template>
      <script type="application/dart" src="person_component.dart"></script>
    </element>
  </body>
</html>

如何实现dart中WebUI HTML模板可访问的枚举？

1 个答案: