Почему слетает библиотека v-maska при обновлении компонента?

Question

[ByJumping]

Привет, использую библиотеку v-maska в проекте.

<input
                v-maska="'+7 (###) ###-##-##'"
                type="text"
                :value="
                  person.contacts.phones.length > 0
                    ? person.contacts.phones[0]
                    : '-'
                "
                readonly
              />

Маска всегда слетает при обновлении компонента. Везде где вызываются события, которые обновляют этот компонент маска слетает и просто выводит номер 79234445678 (номер рандомный написал).

Чуть выше есть блок с таким кодом

<div
            v-if="person.directions.length > 3"
            :class="{ active: isShowMarks }"
            class="user-rating-title-right-more-wrapper"
            @click="showMarks"
          >
            <span v-if="!isShowMarks" class="user-rating-title-right-more" />
            <i v-else class="icon-close-directions"></i>
          </div>

Этот блок показывает/скрывает маркеры. При событии @click="showMarks" слетает v-maska на input. Это я указал для примера, вообще если происходит событие updated то слетает v-maska.

Пробовал принудительно обновлять компонент еще раз, пробовал убирать v-if и прочее. Но результат один, когда происходит обновление компонента маска на телефоне слетает.

Answer 1

[ByJumping]

Проблему решил, не понял почему так работает но вместо :value на input нужно связать v-model, тогда библиотека не слетает при обновлении компонента