4

アプリケーションに複数のコンポーネントがあり、それぞれに独自のビューがあるとします。

コンポーネントは独立していますが、それらのビューは DOM 要素に同じ識別子を使用する場合があります。たとえば、2 つ以上のコンポーネントが次のような同様の入力コントロールを持つビューを持つ可能性があります。

<label for="Bid">Bid</label>
<input type="text" id="Bid" name="Bid" value="0"/>

コンポーネントがアクティブ化された後、それらのビューは によって DOM にアタッチされBoiler.ViewTemplate、要素の名前の競合がBid発生し、副作用が発生します。たとえばlabel、1 つのビューでのみクリックすると機能し、他のビューでは無効になります。

このような衝突を回避するためのベストプラクティスは何ですか? のように、ビュー内のすべての要素に「一意の」サフィックス/プレフィックスを使用する必要がありid="ComponentName_Bid"ますか? または、よりエレガントなソリューションがありますか?

4

2 に答える 2

0

これは確かに非常に良い質問です。私も何度も悩みました。以前、すべての ViewTemplate インスタンスに対して自動生成された一意の ID を与える実装を行いました。

  • この UID は、ViewTemplate インスタンスから渡すことで、JS ロジック (viewmodel.js など) から使用できます。
  • これは、view.html だけでなく、コンポーネント固有の .css ファイルでもタグ {comp.uid} として使用できます。このタグは、'nls' 置換に使用されるのと同じように、特別な ViewTemplate ロジックに置き換えられます (ビューの 105 行を参照)。 -template.js)。

もちろんそれは機能しましたが、複雑すぎて開発者が理解できませんでした。したがって、BoilerplateJS の以降のバージョンでは、この機能を削除し、上記で提案したように、開発者が elementID を手動で管理できるようにしました。

これに最適なアプローチはまだわかりません..しかし、今のところ、手動​​で管理することでコードがよりクリーンになると思います。

于 2012-12-29T05:25:48.367 に答える
0

別のオプションは、次のように単純にinput内部に配置することです。label

<label>
   Last Name
   <input type="text" name="lastname" />
</label>
于 2013-11-25T14:42:00.927 に答える