autocomplete = “ off ”を電光石火の形で設定する方法

問題

クラスslds-inputの入力要素にHTML属性auto-complete="off"を設定しようとしています。何らかの理由で、テンプレートはレンダリング時に常にこれをautocomplete="true"に変換します。

sObjectを検索するカスタム検索フィールドを作成したため、ブラウザのオートコンプリート動作は次のようになります。明らかに役に立たず、これが通常のhtmlの場合、値offを指定してautocomplete属性を含めることができますが、auraはそうではないようです。

html-autocomplete="off"を使用することを提案した回答が見つかったので、それも試しましたが、そうすると、属性がまったくレンダリングされません。

試したこと

  • autocomplete="off"html-autocomplete="off"を含めてみました入力タグに
  • 入力タグを囲むフォームタグにautocomplette="off"html-autocomplete="off"を含めてみました
  • aria-autocompleteの値を調整してみました(何もしませんでした。本当に期待していたわけではありませんが、少なくとも試してみたかったのです)。
  • auraドキュメントのこのPDF html属性autocompleteは言及されていません。
  • auraでサポートされているHTMLタグですが、サポートされている属性のリストがありません
  • この動作については、Lightningドキュメントで何も見つかりません。非常に困難です。オートコンプリートライトニング/オーラ要素のためにグーグルに

これを行う方法はありますか?または、この動作に関するドキュメントですか?

コードサンプル:

これ:

<aura:component> <input type="text" autocomplete="off" /> </aura:component> 

最終的に公開されますこのようなHTML:

<input type="text" autocomplete="true" data-aura-rendered-by="5:0"> 

コメント

  • 内容' sは通常のhtml入力の使用を停止しますか?マークアップにコードを追加して、再現に役立てていただけませんか。
  • 'が私を止めているのは、オーラ(または稲妻)がコードを変更する方法です。追加されたコード
  • Chromeが尊重するため、オフ/オンの代わりにautocomplete = " password "を使用します。 Chromeは通常、オートコンプリートを無視します。試してみて、うまくいくかどうかを確認してください

回答

春19の時点で可能です。ここ

オートコンプリート-フィールドのオートコンプリートを制御します。この属性は、電子メール、検索、電話、テキスト、およびURLの入力タイプでサポートされています。オンとオフの値はサポートされていますが、自動入力の動作はブラウザによって異なります。オートコンプリート属性を設定すると、lightning:inputコンポーネントは値を渡して、ブラウザで解釈します。

回答

Salesforceのサポートと話しましたが、現在これは不可能なようです。

(私はここに回答を受け入れた回答として残していません。より良い選択肢があるときに誰かにこの質問を見つけて答えてもらいたいので、私はそれらを承認済みとしてマークします。)


回避策:

ただし、私は次のハッキング回避策を使用しています:

要素にIDを指定し、このJSを実行します:

turnOffAutocomplete : function(component) { var input = document.getElementById("id-of-the-input"); if(input.getAttribute("autocomplete") !== "off"){ input.setAttribute("autocomplete","off"); } } 

実行していますinitではなく(要素がレンダリングされる前に実行されるため)、代わりに入力要素がフォーカスされたとき。

これを改善するためのコメント(したがって、 「たとえば、入力がフォーカスされるたびに実行する必要はありません)。

コメント

  • このロジックをレンダラーに移動します。

回答

私が見つけた唯一の解決策はrows = “1”

<textarea type="text" class="slds-input" rows="1" style="resize : none;" /> 

でtextAreaを使用するsldsクラスをいくつか追加して同じ表示にすることができます通常の入力。

回答

これを試すことができます。 aura:idを使用して作業し、「オートコンプリート」をオフに設定しました。照明コントローラーのinitメソッドで使用できます

component.find("fieldSelect").set("v.autocomplete","off"); 

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です