Как обновить v-if с данными? - PullRequest
Новая
       23

Как обновить v-if с данными?

0 голосов
/ 09 апреля 2019

Я создаю простое приложение с vueJS, но у меня есть некоторые проблемы с реактивностью.

Когда пользователь подключается к приложению и получает JWT, я сохраняю этот JWT в своем локальном хранилище.И для проверки, если пользователь вошел в систему, я просто проверяю наличие токена.

Прежде всего, это хороший метод?

Теперь я пытаюсь обновить панель навигации, когда пользователь не зарегистрирован, у меня есть 2 кнопки «зарегистрироваться» «войти», когдаон вошел в систему. Я хочу, чтобы моя кнопка «отключить» отображалась, а две другие исчезли.

У меня есть компонент navbar с «v-if» внутри для отображения или отсутствия кнопок.

В настоящее время я установил логическое значение "isLogged" в моих данных (), как заставить vueJS просматривать эти данные и обновлять мой компонент при обновлении этих данных? 

    <div class="navbar-item" v-if="!isLogged">
        <div class="buttons">
            <a @click="$router.push('/login')" class="button nav-button is-outlined">
                CONNEXION
            </a>
            <a @click="$router.push('/register')" class="button nav-button is-outlined">
                INSCRIPTION
            </a>
        </div>
    </div>
    <a @click="disconnect" class="navbar-item" v-if="isLogged">
        Déconnexion
    </a>

    data() {
        return {
            isLogged: this.$jwt.hasToken()
        }
    }

Я бы хотелмне нужно обновить панель навигации без обновления компонента.

1 Ответ

2 голосов
/ 09 апреля 2019

Используйте вычисленное значение вместо данных. 

computed: {
    isLogged() {
        return this.$jwt.hasToken()
    }
}
...