Grid Column Width AutoSize

Flow
1

Hi everyone, I need help with How to Enable autosize in my Vaadin Grid component with LitElement.

      <vaadin-grid id="gridTime" .items="${this.dfDataToDisplay}">
        <vaadin-grid-column path="nroCia" ?autoWidth="${true}" > </vaadin-grid-column>
        <vaadin-grid-column path="codNeumatico"> </vaadin-grid-column>
        <vaadin-grid-column id="dateTime" path="fechaMov" ?autoWidth="${true}" > </vaadin-grid-column>
        <vaadin-grid-column path="codCondicion"> </vaadin-grid-column>
      </vaadin-grid>

When items arrive I run

this.shadowRoot.getElementById("gridTime").recalculateColumnWidths();

But nothin happens ;c

2

It should be either .autoWidth="${true}" (for a property binding to property autoWidth) or alternatively ?auto-width="${true}" (for a boolean attribute binding to attribute auto-width) instead of ?autoWidth="${true}". Assuming you’re planning to change true to some dynamic binding. Otherwise you could just have auto-width as is without any Lit specific binding syntax.

3

Kari is right, you can take a look onto the example over here with simple auto-width attribute added to the column: https://glitch.com/edit/#!/resize-columns?path=app.js:9:50

4

Thank you both, It works.