removeDataField: will remove the same datafield which has diffrent index

[Fuminhsg]

I was trying to use visual.addDataField first to add new data fields and then use visual.removeDataField to remove old data fields.

For example, the initial dataFields is [dataField 1, dataField 2]. After addDataField, I got dataFields = [dataField 1(old), dataField 2(old), dataField 1(new), dataField 2(new)]. I want to remove the first two old dataFields in the array. But when I use:

            visual.getDataFields(dataRole).then((dataFields) => {
                  dataFields.forEach((datafield, index) => {
                    if (index < 2) {
                      visual.removeDataField(dataRole, 0);
                    }
                  });
                });

I expect to get dataFields = [dataField 1(new), dataField 2(new)], but I got dataFields = [ ] instead.