Подскажите, пожалуйста, почему данная конструкция не рабтает? Возвращает desktop и

Question

Подскажите, пожалуйста, почему данная конструкция не рабтает? Возвращает desktop и

не реагирует на изменения.

<template>
<input :class="['desktop', adaptiveDevice == 'desktop' ? 'active' : '']"
type="button"
@click="localStorage.setItem('adaptiveDevice', desktop)">
<input :class="['mobile', adaptiveDevice == 'mobile' ? 'active' : '']"
type="button"
@click="localStorage.setItem('adaptiveDevice', mobile)">
</template>

<script>
computed: {
adaptiveDevice() {
if (!(localStorage.getItem('adaptiveDevice'))) {
return 'desktop'
} else {
return localStorage.getItem('adaptiveDevice')
}
},
}
<script>

Хочу в локалсторедж сохранить состояние приложения, которое человек просматривает, (мобильное или десктопное). Для моего приложжения нормально, чтобы можно было часто переключатся между данными состояниями. Заранее благодарю!