Get the values of views fields in a Twig template

Question

I have created a view that outputs 3 fields for each row. Just using views, i can get the output to look something like this:

<li>[Field1 Value] [field2 value] [field3 value]</li>

I have a requirement to set a data-attribute on the list items to on of the field values. Also, I want to wrap an anchor linking to the detail view of the content around all three field values.

I've tried using a twig template like views-view-fields.html.twig (too generic i know, but for testing purposes) but the values dont seem to be there. I can do {{ dump (fields|keys) }} and i see my fields there, but if i do {{ dump (fields.my_field|keys) }} then its just an empty array.

I also tried using a template like page--[name of my page created by views].html.twig but couldn't seem to find the values for those fields there either.

Any help on advice as to where I should be looking, particulary which twig templates I might create/override and how to get the values would be very much appreciated!

Answer 1

In the template file (views-view-field), you can use

<li> {{ row._entity.field_name1.value }} {{ row._entity.field_name2.value }} {{ row._entity.field_name3.value }}</li>

Or, in your theme, in the preprocess function you can overwrite the output:

function your_theme_name_preprocess_views_view_field(&$variables) {
    $view = $variables['view'];
    if ($view->storage->id() == 'your_view_name') {
        $variables['output'] = '<li>' . 
          $variables['row']->_entity->field_name1->value . 
          $variables['row']->_entity->field_name2->value . 
          $variables['row']->_entity->field_name3->value . 
        '</li>';
    }
}

Answer 2

Actually you can use views templates the way it was in Drupal 7. Although there is no theme info in the advanced part of views settings you can take basic templates from templates folder of the core views module. To create a views template for each row name it views-view-fields--VIEW-NAME.html.twig where VIEW-NAME is a machine name of your view or views-view-fields--VIEW-NAME--DISPLAY-NAME.html.twig where DISPLAY-NAME is a display you are using(block, page etc). Add them in your templates theme folder.

Use template_preprocess_views_view_fields(&$variables) function to preprocess each row.

In your template fields are available this way {{ fields.field_name.content }}

Answer 3

Will $row get what you need instead of the processed field entity?

{{ kint(row.node_field_data_created) }}