React-devtools: Expanda todos os nós
Por padrão, as ferramentas de desenvolvimento recolhem tudo. E é tedioso ter que continuar expandindo um por um, e não há como expandir todos eles.
É possível que esteja faltando alguma coisa porque é muito tedioso e fiquei surpreso ao ver que minha pesquisa preliminar sobre os problemas não produziu resultados relacionados a isso.
Considere ter uma opção "Expandir tudo" para os nós mostrados e também uma opção de expansão automática. Às vezes, queremos expandir automaticamente e às vezes não, dependendo do tamanho da árvore e do nó raiz que está no escopo. Portanto, ter a capacidade de expansão automática será de grande ajuda.
prasannavl
Todos 3 comentários
Não acho que planejemos fazer isso porque pode facilmente ficar proibitivamente grande em páginas com árvores grandes (ex: Facebook). Se você selecionar um nó no painel Elementos e alternar para o painel React, ele deverá destacar automaticamente o componente correspondente.
Espero que ajude!
sophiebits
em 31 mar. 2016
@spicyj escreveu:
Não acho que planejemos fazer isso porque pode facilmente ficar proibitivamente grande em páginas com árvores grandes (ex: Facebook).
Perdoe-me se esta é uma pergunta estúpida (Eu sou bastante novo para reagir), mas não o cartaz original já sugere, ou pelo menos implicam uma forma de implementar este recurso, evitando quaisquer problemas com o desempenho em páginas com árvores de grande porte? Ele disse:
Considere ter também uma [...] opção de expansão automática. Às vezes, queremos expandir automaticamente e às vezes não, dependendo do tamanho da árvore e do nó raiz que está no escopo.
Portanto, a solução simples seria uma opção que o manual do usuário habilita ou desabilita, dependendo se a árvore é pequena o suficiente para a expansão automática funcionar com um desempenho aceitável. Concedido, o usuário pode habilitar isso para um site com uma árvore pequena e, em seguida, mudar para outro site com uma árvore grande e ter seu navegador (ou pelo menos, a guia) paralisado. Mas não seria muito fácil se defender contra isso? Posso pensar em várias abordagens que podem até ser combinadas:
- Limite o recurso de expansão automática a uma profundidade máxima. (OK, isso nem sempre funcionará se você tiver uma árvore rasa e muito larga.)
- Limite o recurso de expansão automática a um número máximo de nós. Se a expansão automática de um nó derrubar o número total de nós visíveis acima desse limite, simplesmente pare a expansão automática.
- Limite o recurso de expansão automática a um número máximo de nós por pai. (Semelhante ao anterior, mas com limites por nó.)
- Expanda automaticamente tantos nós quanto você puder dentro de um limite de tempo fixo.
Seria ótimo se você pudesse reconsiderar se esse recurso seria possível de implementar, porque a visualização padrão que mostra apenas o componente raiz recolhido realmente não é muito útil. Para comparação, é importante notar que a árvore na guia Elementos é automaticamente expandida por padrão para que não apenas o elemento raiz <html> expandido, mas também o nível superior em <body> fique visível.
Se você selecionar um nó no painel Elementos e alternar para o painel React, ele deverá destacar automaticamente o componente correspondente.
Obrigado, esta é uma dica muito útil! No entanto, ainda é muito inconveniente ter que mudar para a guia Elementos e voltar para a guia React cada vez que a página é recarregada (o que é muito frequente durante o desenvolvimento).
aspiers
em 25 mar. 2017
Esta funcionalidade de expandir tudo foi implementada e mesclada, de acordo com
https://github.com/facebook/react-devtools/issues/591
https://github.com/facebook/react-devtools/pull/621
Chaves:
alt + seta para a direita para expandir tudo
alt + seta para a esquerda para recolher tudo
RobBednark
em 26 set. 2018
Questões relacionadas
Bnaya
·
3Comentários
txiaocao
·
5Comentários
aganglada
·
4Comentários
jerikson
·
4Comentários
Riokai
·
5Comentários
Comentários muito úteis
@spicyj escreveu:
Perdoe-me se esta é uma pergunta estúpida (Eu sou bastante novo para reagir), mas não o cartaz original já sugere, ou pelo menos implicam uma forma de implementar este recurso, evitando quaisquer problemas com o desempenho em páginas com árvores de grande porte? Ele disse:
Portanto, a solução simples seria uma opção que o manual do usuário habilita ou desabilita, dependendo se a árvore é pequena o suficiente para a expansão automática funcionar com um desempenho aceitável. Concedido, o usuário pode habilitar isso para um site com uma árvore pequena e, em seguida, mudar para outro site com uma árvore grande e ter seu navegador (ou pelo menos, a guia) paralisado. Mas não seria muito fácil se defender contra isso? Posso pensar em várias abordagens que podem até ser combinadas:
Seria ótimo se você pudesse reconsiderar se esse recurso seria possível de implementar, porque a visualização padrão que mostra apenas o componente raiz recolhido realmente não é muito útil. Para comparação, é importante notar que a árvore na guia Elementos é automaticamente expandida por padrão para que não apenas o elemento raiz
<html>expandido, mas também o nível superior em<body>fique visível.Obrigado, esta é uma dica muito útil! No entanto, ainda é muito inconveniente ter que mudar para a guia Elementos e voltar para a guia React cada vez que a página é recarregada (o que é muito frequente durante o desenvolvimento).