Migration depuis Vuex 0.6.x à 1.0

Vuex 2.0 est sorti, mais ce guide ne couvre que la migration vers la version 1.0 ? C’est une erreur ? En fait, Vuex 1.0 et 2.0 sont sortis simultanément. Ça veut dire quoi ? Lequel dois-je utiliser et lesquels sont compatibles avec Vue 2.0 ?

Pour Vuex 1.0 et 2.0 :

Ils ciblent cependant des utilisateurs légèrement différents.

Vuex 2.0 est complètement revisité et son API est simplifiée. Parfait pour ceux qui commencent de nouveaux projets ou qui veulent être à la pointe de la gestion d’état côté client. Il n’est pas couvert par ce guide de migration et vous devez donc vous tourner vers la documentation Vuex 2.0 si vous souhaitez en apprendre plus à son sujet.

Vuex 1.0 est en partie compatible avec ses versions antérieures, il requiert vraiment peu de changement pour être mis à jour. Il est recommandé pour les grandes bases de code ou pour ceux qui souhaitent migrer lentement vers Vue 2.0. Ce guide est réalisé pour faciliter cette tâche mais n’inclut que des notes de migration. Pour le guide complet d’utilisation, consultez la documentation Vuex 1.0.

store.watch avec chemin en propriété remplacée

store.watch n’accepte plus que des fonctions. Donc par exemple, vous devrez remplacer :

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

par :

store.watch(
// Quand le résultat retourné change...
function (state) {
return state.user.notifications
},
// Lancer cette fonction de rappel
callback
)

Cela vous donne un contrôle plus complet sur les propriétés réactives que vous souhaitez observer.

Comment procéder ?

Lancez l'outil d'aide à la migration sur votre code pour trouver tous les exemples de store.watch avec une chaine de caractère comme premier argument.

Émetteur d’évènement du Store supprimé

L’instance du store n’expose plus l’interface d’émetteur d’évènement (on, off, emit). Si vous utilisiez précédemment le store comme un canal global d’évènement, consultez cette section pour des instructions de migration.

Au lieu d’utiliser cette interface pour observer les émetteurs d’évènement dans le store lui-même (par ex. store.on('mutation', callback)), une nouvelle méthode store.subscribe a été introduite. L’utilisation typique dans un plugin serait :

var myPlugin = store => {
store.subscribe(function (mutation, state) {
// Faire quelque chose...
})
}

Consultez comme exemple la documentation des plugins pour plus d’informations.

Comment procéder ?

Lancez l'outil d'aide à la migration sur votre code pour trouver tous les exemples de store.on, store.off et store.emit.

Middlewares remplacés

Les middlewares sont remplacés par les plugins. Un plugin est une simple fonction qui fournit le store comme seul argument et qui peut écouter les mutations d’évènement sur le store :

const myPlugins = store => {
store.subscribe('mutation', (mutation, state) => {
// Faire quelque chose...
})
}

Pour plus de détails, consultez la documentation des plugins.

Comment procéder ?

Lancez l'outil d'aide à la migration sur votre code pour trouver tous les exemples de l'option middlewares sur un store.