Material-ui: Como acionar programaticamente o foco () no campo Selecionar?

Criado em 16 nov. 2017  ·  3Comentários  ·  Fonte: mui-org/material-ui


Meus formulários de aplicativo utilizam o botão Enter para acessar os campos especificados para velocidade em um teclado de dez teclas. Quando enter é pressionado, fazemos uma pesquisa de DOM e acionamos o focus () no próximo elemento. Isso funciona muito bem em campos de texto, mas não consigo entender como fazer isso em uma caixa de seleção. Posso obter cada um dos elementos DOM que compõem a estrutura Select, mas disparar focus () em qualquer nível não faz nada.
Nota: Eu sou capaz de pegar o ref do item via inputRef no select para nos prevenir de atravessar o DOM, mas ainda não produz resultados.
Agradeço antecipadamente por qualquer orientação!

  • [x] Pesquisei os problemas deste repositório e acredito que não seja uma duplicata.

Comportamento esperado


A seleção fica focada (mas não aberta) quando o foco () é acionado manualmente. Espere o mesmo comportamento de baterno elemento anterior.

Comportamento Atual


O disparo de node.focus () não faz nada, nem dispara em qualquer elemento dentro da estrutura DOM selecionada.

Etapas para reproduzir (para bugs)


https://codesandbox.io/s/m43qqyo2zy

  1. Selecione a primeira caixa de texto.
  2. Pressione a tecla Enter.
  3. Observe que a segunda caixa de texto está focada em FTW.
  4. Pressione a tecla Enter novamente.
  5. Nada acontece.

Contexto

Seu Ambiente

| Tech | Versão |
| -------------- | --------- |
| Material-UI | 1.0.0-beta.21 |
| React | 16.1.0 |
| navegador | Chrome 62 |
| etc | |

question

Comentários muito úteis

Todos 3 comentários

@zachariahtimothy Não estou convencido de que isso seja um problema com o MUI. Parece que você precisa fazer uma limpeza de formulário. Vá para Stack Overflow para perguntas sobre como usar a biblioteca. Felicidades! 😄

@ m2mathew vejo o que você está dizendo, vou fazer a pergunta sobre estouro de pilha.
Minha opinião é que se o select do MUI é impossível de tratar como um elemento de formulário nativo em termos de eventos, então seria um problema com a biblioteca. Eu tentei com a bandeira nativa que funcionou, então isso vai me ajudar, só não tem a beleza que eu desejo como o select sobrescrito :).
Obrigado pela resposta e pela biblioteca incrível!

Esta página foi útil?
0 / 5 - 0 avaliações

Questões relacionadas

ericraffin picture ericraffin  ·  3Comentários

pola88 picture pola88  ·  3Comentários

sys13 picture sys13  ·  3Comentários

FranBran picture FranBran  ·  3Comentários

ryanflorence picture ryanflorence  ·  3Comentários