const columns = [
      { header: 'ID', binding: 'id' },
      { header: 'Country', binding: 'country' },
      { header: 'Sales', binding: 'sales', width: 210 },
      { header: 'Expenses', binding: 'expenses' },
    ];
    
    function handleInitialized(grid) {
      // JSコードで列を設定します
      for (let columnIndex = 0; columnIndex < columns.length; columnIndex++) {
    grid.columns.push(new wjGrid.Column(columns[columnIndex]));
  }
}

return (
  <div className="container-fluid">
    <wjcGrid.FlexGrid
      autoGenerateColumns={false}
      itemsSource={source}
      initialized={handleInitialized}
    >
    {/* FlexGridColumn コンポーネントは利用しません
    <wjcGrid.FlexGridColumn header="ID" binding="id" />
      <wjcGrid.FlexGridColumn header="Country" binding="country" />
      <wjcGrid.FlexGridColumn header="Sales" binding="sales" />
      <wjcGrid.FlexGridColumn header="Expenses" binding="expenses" /> */}
    </wjcGrid.FlexGrid>
  </div>
);

"dependencies": {
  ・・・
  "mutation-events": "^1.0.5",
}

Angularアプリケーション（angular.jsonファイル）

・・・
  "polyfills": [
    "mutation-events",
・・・

Vue.jsアプリケーション（main.jsファイル）

import "mutation-events";
・・・

Reactアプリケーション（index.jsファイル）

import "mutation-events";

AngularJSアプリケーション
1.
以下からmutation-events-polyfillを含むプロジェクトをダウンロードしてください。
https://github.com/mfreed7/mutation-events-polyfill

2.
AngularJSアプリケーション内のhtmlファイルのヘッダーに1.でダウンロードした「mutation-events.js」ファイルを含めてください。

<script src="./mutation_events.js"></script>

<div>
  <div>
    <button (click)="handleShuffleColumns($event)">列をinsertBeforeメソッドで入れ替えます。</button>
  </div>
  <div>
    <wj-flex-grid #grid [itemsSource]="data">
      <wj-flex-grid-column [binding]="'id'" [header]="'ID'"> </wj-flex-grid-column>
      <wj-flex-grid-column [binding]="'country'" [width]="100" [header]="'Country'">
      </wj-flex-grid-column>
      <wj-flex-grid-column [binding]="'date'" [width]="100" [header]="'Date'">
      </wj-flex-grid-column>
      <wj-flex-grid-column [binding]="'amount'" [width]="100">
      </wj-flex-grid-column>
      <wj-flex-grid-column [binding]="'amount2'" [width]="100">
      </wj-flex-grid-column>
    </wj-flex-grid>
  </div>
</div> 

handleShuffleColumns(e: any) {
  if (this.grid.columns.length) {
    //WebのAPIを利用し、列コンポーネントのDOMに直接アクセスする
    let columnsContainer = this.grid.columns[0]._wjBehaviour.elementRef.nativeElement.parentElement;
    let columnsHostElementsList = columnsContainer.children;
    if(columnsHostElementsList.length > 3)
    {
      let firstColumnHostElement = columnsHostElementsList[0], thirdColumnHostElement = columnsHostElementsList[2];
      //insertBeforeメソッドでFlexGridの列のDOMを動的に操作（3列目を1列目に移動）する
      columnsContainer.insertBefore(thirdColumnHostElement, firstColumnHostElement);
    }
  }
}