VueJS 3. Не работает v-for

Я написал класс CellsFactory, который возвращает мне массив с параметрами для каждой Cell.

    export class CellsFactory{
    // Поля класса.
    area;

    constructor(area) {
        this.area = area;
    } // constructor.

    make(){
        let array = [];

        let numberOfAllCells = this.numberOfAllCells();

        for (let i = 1; i <= numberOfAllCells; i++){
            let coord = this.getCoordFromNumber(i);

            array.push({
                coord,
                // У ячейки может быть три состояния:
                // 1. Не тронута — untouched.
                // 2. Промах     — miss.
                // 3. Попадание  — hit.
                state: 'untouched'
            }) // push.
        } // for.

        return array;
    } // make.

    numberOfAllCells(){
        return this.area * this.area;
    }

    getCoordFromNumber(num) {
        let actualNum = num - 1;

        let coordY = Math.floor(actualNum / this.area);
        let coordX = actualNum - coordY * this.area;

        return {x: coordX + 1, y: coordY + 1};
    }
} // CellsFactory.

В моём компоненте я при помощи v-for хочу создать для каждого элемента массива cellsArray компонент Cell, который я написал, но ничего не происходит, даже ошибки нет. Такое ощущение, что cellsArray пустой, но я проверял, что это не так. Единственное, что меня беспокоит - cellsArray не возвращается напрямую, а он обёрнут в Proxy. Я новичок в Vue, поэтому не понимаю, для чего это нужно.

    <template>
  <div class="cells-container">

    <Cell v-for="(cell, index) in cellsArray"
          :key="index"
          :coord-x="cell.coord.x"
          :coord-y="cell.coord.y"
          @click="cellClickHandler"
    ></Cell>
  </div>
</template>

<script>
import Cell from "@/components/Cell";
import {CellsFactory} from "@/factories/cells-factory";
export default {
  components: {Cell},
  computed:{
    numberOfAllCells(){
      return this.area * this.area;
    },
  },
  data(){
    return {
      area: 7,
      cellsArray: new CellsFactory(this.area).make()
    } // return.
  }, // data.
  methods:{
    cellClickHandler(){
      this.cellsArray = new CellsFactory(this.area).make();

      console.log(this.cellsArray[0].coord.x);
    }
  },

  name: "PlayingField"
} // default.
</script>