How to dynamically change the maximum number of array elements?

Question

Vue.js

sandbox
There is a functionality for choosing the type of room. The room type object contains a field for the maximum number of guests that can be in this room.
The problem is that if you select a room type with a large possible number of guests, add guests, and then change the type to a type with a smaller possible number of guests, then this number remains from the previous type, i.e. greater than the maximum possible for the current type

Answer 1

Hang up a method to change the type of room.
When changing the type, check the current number of guests.
If more than the maximum number in the new one, change the array of guests as needed (delete unnecessary ones, reset them to zero, or something else).