Обновите элемент массива json идентификатором из компонента vue

#json #vue.js

Вопрос:

Я пытаюсь создать страницу подсчета очков в гольфе, на которой будут записываться результаты моих игр и игр моих друзей. Я знаю, что для этого уже есть множество приложений, но когда друг отслеживает счет, я буду знать только, как все прошло, без возможности сравнивать отверстия с предыдущими играми(без необходимости просить друзей просмотреть все данные).

У меня есть вид «отверстие», который показывает текущий размер отверстия, длину и изображение карты. Вид сам прокладывает маршрут для каждого отдельного отверстия (например score.com/map/hole/18).

Он также показывает компонент игрока для каждого активного игрока. Компонент плеера отслеживает свой идентификатор и счет в массиве размером 18.

Теперь, когда я добавляю счет в текущую лунку для каждого игрока, я хочу вставить этот счет из компонента Игрока в свой файл данных json.

 # db.json #

"activeGame": {
    "players": [
      {
        "id": 0,
        "scores": [] #1 element for each hole
      },
      {
        "id": 3,
        "scores": []
      }
    ],
    "map": "401",
    "startTime": "2021-08-28T13:48:17.251Z"
  }
 

Мне удалось заменить всех активных игроков только текущим с помощью этого

 # Player.vue
  methods: {
      async postScore() {
        const res = await axios.patch("http://localhost:3000/activeGame", 
        { players:{
          id: this.player.id,
          score: this.score
          }                         
      });
    }
}
 

Можно ли этого достичь без извлечения всех данных для всех игроков? Было бы лучше, если бы компонент игрока выдавал счет до представления отверстия(каким-то образом)? Или я могу каким-то образом улучшить свой db.json?