Как пользователь удаляет столбец, в котором есть данные, он претендует, что столбец удаляется и таблица обновляется, но столбец не удаляется

Question

Ожидаемый результат - пользователь должен получить предупреждение о том, что столбец таблицы содержит данные, и его нельзя удалить

Фактический результат - Столбец таблицы исчезает, когда пользователь нажимает кнопку удаления, а когда пользователь нажимает кнопку сохранения, он показывает эта таблица обновлена. После того, как пользователь обновил страницу, таблица отображается с удаленным столбцом.

 async removeField(field) {
    // debugger
    var data = await this.apiService.getTableData(this.table.id)
    this.table.id = this.replaceAll(JSON.stringify(this.table.propertyJson),'"',"'")
    // this.table.propertyJson = this.replaceAll(JSON.stringify(this.table.fields),'"',"'")
    // console.log(this.table.propertyJson)

    if(data.length != 0){
      alert('Deleting is not allowed for column/columns with data.')
      this.table.fields.splice(removingIndex, 0)
      this.table.hasUnsavedChanges = false
    }
    else{
      var removingIndex = this.table.fields.indexOf(field)
      this.table.fields.splice(removingIndex, 1)
      this.table.hasUnsavedChanges = true
    }
  }

Пожалуйста, помогите мне.