Qual é a diferença entre os elementos de renderização do container e html_tag?

Sep 28 2020

Qual é a diferença entre os elementos de renderização de #type html_tag (definido como div) e o contêiner no Drupal 8?

O elemento de renderização do contêiner é uma versão mais simples de html_tag? Mais fácil de processar para pré-processar elementos de contêiner?

Eu observo que:

  • historicamente, html_tag era para elementos nulos na tag no Drupal 7.x.
  • se o elemento contêiner for usado como um formulário, ele adicionará a classe form-wrapper / js-form-wrapper e um ID HTML se tiver #array_parents .

Talvez minhas teorias estejam corretas (mais fácil de deixar é por razões históricas / razões dos elementos de forma)?

PHP:

  use Drupal\Core\StringTranslation\TranslatableMarkup;

  $variables['myhtml_tag'] = [ '#type' => 'html_tag', '#tag' => 'div', '#attributes' => [ 'class' => 'my-container-class1', ], 'child' => [ '#markup' => new TranslatableMarkup('Some Container text1.'), ], ]; $variables['mycontainer'] = [
    '#type' => 'container',
    '#attributes' => [
      'class' => 'my-container-class2',
    ],
    'child' => [
      '#markup' => new TranslatableMarkup('Some Container text2.'),
    ],
  ];

HTML:

<div class="my-container-class1">Some Container text1.</div>

<div class="my-container-class2">Some Container text2.</div>

Respostas

4 leymannx Sep 28 2020 at 15:49

Eu fiz "Blame" no system.module 7.x depois de não encontrar uma pista de 'container'no branch 6.x. Em "Blame" você pode ver que o próprio Dries cometeu o patch introduzido $types['container']em 2010 e que isso leva de volta ao seguinte problema em drupal.org:

  • # 557272: FAPI: sistema de estados JavaScript

O problema que introduziu #statesa API de formulário ! Agora vamos procurar na página "container". Ok, o comentário nº 36 explica um pouco o motivo pelo qual foi introduzido:

Conforme discutido com kkaefer e tha_sun, mudamos o tipo de elemento "wrapper" da API de formulário para "container" para não ficarmos muito confusos com outras coisas de "wrapper", como "wrapper_callback", "theme_wrappers", etc. O tipo "container" ainda usa a classe CSS de "* -wrapper", porém, para corresponder ao resto dos padrões de codificação do Drupal.

E no próprio commit você pode ver como os containerelementos já substituem alguns markupelementos ( markupsendo o padrão se #typeomitido) que tinham '#prefix' => '<div>', '#suffix' => '</div>com HTML codificado.

Para resumir: o container é um invólucro clássico. E mais como um elemento de formulário . Visto que html_tagé mais um elemento de renderização , tradicionalmente usado para elementos void, geralmente no HTML <head>. Como colocar meta tags ou colocar bibliotecas JavaScript e CSS em tags de script.

4 marcvangend Sep 28 2020 at 16:39

Boa pergunta. A meu ver, o contêiner é uma maneira simples de embrulhar as coisas em um <div>. Isso é útil para adicionar estrutura a formulários, mas também é muito útil para outras situações em que você precisa criar matrizes de renderização maiores. Costumo usá-lo assim (exemplo simplificado) porque torna seu código mais claro:

$build['wrapper'] = [ '#type' => 'container', '#attributes' => ['class' => ['select-wrapper']], ]; $build['wrapper']['select'] = [
  '#type' => 'select',
  '#title' => $this->t('Select'), '#options' => $options,
  '#empty_option' => $this->t('- Select an option -'),
];

Além disso, o fato de um contêiner não exigir configurações adicionais o torna adequado e frequentemente usado na propriedade #theme_wrappers desta forma:

$form['description'] = [
  '#markup' => $description,
  '#theme_wrappers' => ['container'],
];

Pessoalmente, eu só uso o tipo html_tag para elementos simples que não sejam div, por exemplo:

$build['heading'] = [
  '#type' => 'html_tag',
  '#tag' => 'h2',
  '#value' => 'My Title',
];

Espero que ajude!

2 4k4 Sep 28 2020 at 13:30

O elemento contêiner faz mais sentido em um formulário. Pode ser organizado em grupos, pode ser opcional e o ID, se ausente, é gerado automaticamente.