Can I use ag-grid-community library with LitElements?

Question

Is it possible to use ag-grid-community with LitElements? This is what I have tried but cannot initialize the ag-grid instance using the code below.

Console Error - ag-grid-community.auto.esm.js:45056 Uncaught TypeError: Failed to execute 'observe' on 'MutationObserver': parameter 1 is not of type 'Node'.

import { Grid } from 'ag-grid-community';

export class myComponent extends LitElement {
  static scopedElements = {
    'ag-grid': Grid
  };

  constructor() {
    super();
    this.columnDefs = [
      {headerName: "Make", field: "make"},
      {headerName: "Model", field: "model"},
      {headerName: "Price", field: "price"}
    ];
        
    this.rowData = [
      {make: "Toyota", model: "Celica", price: 35000},
      {make: "Ford", model: "Mondeo", price: 32000},
      {make: "Porsche", model: "Boxter", price: 72000}
    ];
        
    this.gridOptions = {
      columnDefs: this.columnDefs,
      rowData: this.rowData,
    };

    const eGridDiv = document.querySelector('#myGrid');
    new Grid(eGridDiv, this.gridOptions);
  }
  render() {
    return html`
      <div>
          <ag-grid
            .gridOptions=${this.gridOptions}
          ></ag-grid>
      </div>
    `;
  }
}

Answer 1

You must remove the comment text from the code

**指定数据** this.rowData = [    

**让网格知道要使用哪些列和数据** this.gridOptions

Also, I think you forgot to remove the comma here:

.gridOptions=${this.gridOptions}