번개 형식으로 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 태그를 지원했지만 지원되는 속성 목록이 없습니다.
  • Lighting 문서에서이 동작에 대해 아무것도 찾을 수 없으며 매우 어렵습니다. 자동 완성 번개 / 오라 요소 때문에 Google에 문의

이 작업을 수행 할 방법이 있습니까? 아니면이 동작에 대한 문서입니까?

코드 샘플 :

이것은 :

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

최종에 나올 것입니다. HTML :

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

댓글

  • 내용 ' s가 일반 html 입력을 사용하지 못하도록 차단합니까? 을 (를) 재현하는 데 도움이되도록 마크 업에 코드를 추가해 주시겠습니까?
  • ' 나를 막는 것은 아우라 (또는 번개)가 코드를 수정하는 방식입니다. 더 많은 코드 추가
  • 나는 크롬이 존중하기 때문에 off / on 대신 autocomplete = " password "를 사용합니다. 그렇지 않으면 Chrome은 일반적으로 자동 완성을 무시합니다. 한 번 시도해보고 효과가 있는지 확인하세요.

답변

봄 19부터 가능합니다. 여기

자동 완성 — 필드의 자동 완성을 제어합니다. 이 속성은 이메일, 검색, 전화, 텍스트 및 URL 입력 유형에 지원됩니다. on 및 off 값이 지원되지만 자동 채우기 동작은 브라우저에 따라 다릅니다. autocomplete 속성을 설정하면 lightning : input 구성 요소가 값을 전달하여 브라우저에서 해석합니다.

Answer

Salesforce의 지원팀에 문의했는데 현재로서는 불가능한 것 같습니다.

(나는 여기에 내 답변을 허용 된 답변으로 남기지 않습니다. 더 나은 옵션이있을 때 다른 사람이이 질문을 찾아 대답하기를 원하면 수락 된 것으로 표시하겠습니다.)


해결 방법 :

그러나 저는 다음 해킹 해결 방법을 사용하고 있습니다.

요소에 ID를 부여하고이 JS를 실행합니다.

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

실행 중입니다. init (요소가 렌더링되기 전에 실행되기 때문)가 아니라 입력 요소에 초점을 맞출 때입니다.

이를 개선하기위한 모든 의견 (따라서 “예를 들어 입력이 집중 될 때마다 실행할 필요가 없습니다.)

댓글

  • 이 로직을 렌더러로 이동합니다.

답변

내가 찾은 유일한 해결책은 행이 “1”인 textArea 사용

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

일부 slds 클래스를 추가하여 정상적인 입력입니다.

답변

해볼 수 있습니다. ” aura : id를 사용하여 나를 위해 일한 다음 “자동 완성”을 해제했습니다. 조명 컨트롤러의 init 메소드에서 사용할 수 있습니다.

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

답글 남기기

이메일 주소를 발행하지 않을 것입니다. 필수 항목은 *(으)로 표시합니다