Руководство

Миграция с Vuex 0.6.x на 1.0

Состоялся релиз Vuex 2.0, но эта инструкция покрывает только миграцию на 1.0? Это опечатка? Кроме того, похоже, что Vuex 1.0 и 2.0 были выпущены одновременно. Что происходит? Какую из версий я должен использовать и какая из них совместима с Vue 2.0?

Обе версии Vuex 1.0 и 2.0:

Однако, они имеют различные целевые аудитории.

Vuex 2.0 радикально переписан и имеет упрощённый API, для тех, кто начинает новые проекты или хочет быть на острие прогресса в области управления состоянием фронтенд-приложений. Он не покрывается данной инструкцией по миграции, поэтому если вы хотите узнать о нём больше — обратитесь к документации Vuex 2.0.

Vuex 1.0 в основном обратно совместим, поэтому требует внесения довольно незначительных изменений при обновлении. Рекомендуется для тех, кто уже имеет дело с большими проектами, либо для тех, кто просто хочет постепенно обновиться до Vue 2.0. Данное руководство призвано содействовать этому процессу, но включает в себя только заметки по миграции. Для изучения полного руководство по использованию обратитесь к документации Vuex 1.0.

store.watch со строковым параметром заменено

store.watch теперь принимает в качестве аргумента только функции. Например, вы должны заменить:

store.watch('user.notifications', callback)

на:

store.watch(
  // Когда возвращаемый результат изменится...
  function (state) {
    return state.user.notifications
  },
  // Запустится коллбэк
  callback
)

Это даёт более полный контроль над отслеживанием реактивных свойств.

Обновление

Запустите миграционный помощник в вашем проекте, чтобы найти использование store.watch со строкой в качестве первого аргумента.

Вызов событий из хранилища удалено

Экземпляр хранилища больше не предоставляет интерфейс вызова событий (on,off, emit). Если вы ранее использовали хранилище в качестве глобальной шины событий - см. этот раздел инструкций по миграции.

Вместо того чтобы использовать этот интерфейс для отслеживания событий, пробрасываемых самим хранилищем (например, store.on('mutation', callback)), представлен новый метод - store.subscribe. Типичное использование в плагине выглядит как:

var myPlugin = store => {
  store.subscribe(function (mutation, state) {
    // Дальнейшие действия...
  })
}

Обратитесь к документации по плагинам для большей информации.

Обновление

Запустите миграционный помощник в вашем проекте, чтобы найти использование store.on, store.off и store.emit.

Прослойки заменено

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

const myPlugins = store => {
  store.subscribe('mutation', (mutation, state) => {
    // Дальнейшие действия...
  })
}

Для более детального изучения см. документацию по плагинам.

Обновление

Запустите миграционный помощник в вашем проекте, чтобы найти использование middlewares в вашем хранилище.

← Миграция с Vue Router 0.7.x Сравнение с другими фреймворками →
Обнаружили ошибку или хотите добавить что-то своё в документацию? Изменить эту страницу на GitHub! Опубликовано на Netlify .