11

カスタム ポリマー要素で HTML5 ドラッグ アンド ドロップを有効にしようとしていますが、うまくいきません。ポリマーがなければ、draggable属性を追加するだけで済みます。

Dartでの私のコードは次のとおりです。

my_component.html

<polymer-element name="my-component">
  <template>
    <style>
      @host {
        :scope {
          display: block;
        }
      }
      div {
        background-color: red;
        width: 200px;
        height: 200px;
      }
    </style>
    <div>
      Drag me
    </div>
  </template>
  <script type="application/dart" src="my_component.dart"></script>
</polymer-element>

my_component.dart

import 'package:polymer/polymer.dart';

@CustomTag('my-component')
class MyComponent extends PolymerElement {
  MyComponent.created() : super.created();
}

test.html

<!DOCTYPE html>

<html>
  <head>
    <link rel="import" href="my_component.html">

    <script type="application/dart">import 'package:polymer/init.dart';</script>
    <script src="packages/browser/dart.js"></script>
  </head>
  <body>
    <my-component draggable="true"></my-component>
  </body>
</html>

また、HTML 要素から直接拡張してみました。これもうまくいきませんでした。

ポリマー要素をドラッグ可能にする方法はありますか?

編集:これにはバグレポートがあります。

4

4 に答える 4

2

ポリマー1.0/2.0用

ここでのほとんどの回答は、Polymer v0.5 [古い] の OP に回答しようとしています。コアのプレフィックス付き要素は、Polymer 1.0 または 2.0 では機能しません。

ポリマー ベースのドラッグ アンド ドロップをサポートするsortablejsを参照してください。

于 2016-10-28T15:15:48.873 に答える
1

ポリマー要素をドラッグ可能にするために、JS ライブラリDraggabillyを使用しました。私の場合、ポリマー コンポーネントもグリッド内にあったため、Packeryと組み合わせて使用​​しました。

于 2013-11-12T13:54:03.133 に答える