O problema
Estou tentando definir o atributo HTML auto-complete="off" em um elemento de entrada com a classe slds-input. Por alguma razão, o modelo sempre converte isso para autocomplete="true" na renderização.
Eu criei um campo de pesquisa personalizado para pesquisar sObjects e, portanto, o comportamento do preenchimento automático do navegador é obviamente inútil, e se fosse html regular eu poderia apenas incluir o atributo autocomplete com o valor off, mas aura não parece deixe-me.
Uma resposta que encontrei sugeria o uso de html-autocomplete="off", então também tentei isso e, quando faço isso, o atributo simplesmente não é renderizado.
O que eu tentei
- Eu tentei incluir
autocomplete="off"ehtml-autocomplete="off"na tag de entrada - Tentei incluir
autocomplette="off"ehtml-autocomplete="off"na tag de formulário ao redor da tag de entrada - Tentei ajustar o valor
aria-autocomplete(não adiantou nada, não que eu realmente esperasse, mas queria pelo menos tentar). - Em este PDF da documentação da aura o atributo html
autocompletenão é mencionado. - Eu “encontrei uma lista de tags HTML suportadas no aura , mas nenhuma lista de atributos suportados
- Não consigo encontrar nada sobre esse comportamento nos documentos do relâmpago, e é muito difícil ao google por causa do elemento relâmpago / aura autocomplete
Existe alguma maneira de fazer isso? Ou documentação sobre esse comportamento?
Exemplo de código:
Este:
<aura:component> <input type="text" autocomplete="off" /> </aura:component> será lançado no final HTML como este:
<input type="text" autocomplete="true" data-aura-rendered-by="5:0"> Comentários
- O que ' está impedindo você de usar a entrada html regular? Você poderia adicionar algum código à marcação para ajudar a reproduzir.
- o que ' está me impedindo é a maneira como aura (ou talvez relâmpago) modifica o código. Mais código adicionado
- Eu uso autocomplete = " senha " em vez de off / on como o cromo o respeita. O Chrome normalmente ignora o preenchimento automático de outra forma. Experimente e veja se funciona para você
Resposta
Possível a partir do Spring 19. Veja aqui
autocompletar – controla o preenchimento automático do campo. Este atributo é compatível com os tipos de entrada de email, pesquisa, tel, texto e url. Os valores ativado e desativado são suportados, mas o comportamento do preenchimento automático depende do navegador. Quando você define o atributo autocomplete, o componente lightning: input passa o valor para ser interpretado pelo navegador.
Resposta
Acabei de falar com o suporte da Salesforce e aparentemente isso é impossível no momento.
(Estou deixando minha resposta aqui não como aceita porque eu quero que alguém encontre esta pergunta quando houver uma opção melhor e responda e eu irei marcá-la como aceita.)
Solução alternativa:
No entanto, eu estou usando a seguinte solução alternativa de hack:
Dei uma id ao meu elemento e executei este JS:
turnOffAutocomplete : function(component) { var input = document.getElementById("id-of-the-input"); if(input.getAttribute("autocomplete") !== "off"){ input.setAttribute("autocomplete","off"); } } Estou executando-o não em init (porque é executado antes que os elementos sejam renderizados), mas em vez de quando o elemento de entrada está focado.
Quaisquer comentários para melhorar isso (então não “t tem que executar toda vez que a entrada for focada, por exemplo) seria muito apreciado.
Comentários
- Mova essa lógica para o renderizador.
Resposta
A única solução que encontrei foi use uma textArea com rows = “1”
<textarea type="text" class="slds-input" rows="1" style="resize : none;" /> Você pode adicionar algumas slds classes para ter a mesma exibição que uma entrada normal.
Resposta
Você pode tentar isto aqui “s funcionou para mim usando aura: id e, em seguida, desativando o “autocomplete”. Você pode usar no método init do controlador de iluminação
component.find("fieldSelect").set("v.autocomplete","off");