Migration de Vuex 0.6.x vers 1.0


Vuex 2.0 est sorti, mais ce guide ne couvre que la migration vers 1.0 ? Est-ce une faute de frappe ? De plus, il semble que Vuex 1.0 et 2.0 soient également publiés en même temps. Comment ça se passe ? Lequel dois-je utiliser et lequel est compatible avec Vue 2.0 ?


Vuex 1.0 et 2.0 sont les suivants :

  • Les deux prennent entièrement en charge Vue 1.0 et 2.0

  • resteront pris en charge dans un avenir prévisible


cependant leurs utilisateurs cibles sont légèrement différents.

Vuex 2.0 est fondamentalement repensé et fournit une API propre pour aider les utilisateurs qui démarrent un nouveau projet ou qui souhaitent utiliser une technologie de pointe avec la gestion de l'état côté client. Ce guide de migration ne couvre pas le contenu lié à Vuex 2.0, donc si vous souhaitez en savoir plus, consultez la Documentation Vuex 2.0.

Vuex 1.0 est principalement rétrocompatible, la mise à niveau ne nécessite donc que des modifications mineures. Recommandé pour les utilisateurs disposant de grandes bases de code existantes ou pour ceux qui souhaitent simplement passer à Vue 2.0 aussi facilement que possible. Ce guide est destiné à faciliter ce processus mais comprend uniquement des instructions de migration. Pour obtenir des instructions d'utilisation complètes, veuillez consulter la documentation Vuex 1.0.


Répertoire


store.watch remplacementstore.watch 替换


store.watch 现在只接受函数。因此,下面例子你需要替换:

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

为:

store.watch(
  // 当返回结果改变...
  function (state) {
    return state.user.notifications
  },
  // 执行回调函数
  callback
)

这帮助你更加完善的控制那些需要监听的响应式属性。

升级方式

在代码库运行 迁移工具,查找在 store.watch


store.watch avec chemin d'attribut de chaîne Désormais, seules les fonctions sont acceptées. Par conséquent, dans l'exemple suivant, vous devez remplacer :
var myPlugin = store => {
  store.subscribe(function (mutation, state) {
    // Do something...
  })
}
🎜 par : 🎜
const myPlugins = store => {
  store.subscribe('mutation', (mutation, state) => {
    // Do something...
  })
}
🎜 Cela vous aide à contrôler plus complètement les propriétés réactives qui doivent être surveillées. 🎜
🎜🎜Méthode de mise à niveau 🎜🎜🎜Exécutez l'outil de migration🎜 dans la base de code, trouvez-le dans store.watch utilise une chaîne comme premier paramètre. 🎜🎜


Déclencheur d'événement StoreSupprimé


l'instance de magasin n'expose plus l'interface de l'émetteur d'événement (on, off, emit< /code>). Si vous avez déjà utilisé le magasin comme bus d'événements global, veuillez vous référer à ce chapitre pour la migration. instructions. on, off, emit)。如果你之前使用 store 作为全局的 event bus,迁移说明相关内容请查阅 此章节

为了替换正在使用观察 store 自身触发事件的这些接口,(例如:store.on('mutation', callback)),我们引入新的方法 store.subscribe。在插件中的典型使用方式如下:

rrreee

更多信息请查阅 插件文档 的示例。

升级方式

在代码库运行 迁移工具,查找使用了 store.onstore.offstore.emit 的事例。


中间件 替换


中间件被替换为插件。插件是接收 store 作为仅有参数的基本函数,能够监听 store 中的 mutation 事件:

rrreee

更多详情,请查阅 插件文档

升级方式

在代码库运行 迁移工具,查找使用了 middlewares

Afin de remplacer ces interfaces qui servent à observer les événements déclenchés par le magasin lui-même, (par exemple : store.on('mutation', callback)), nous introduisons la nouvelle méthode < code>store.subscribe< /code>. L'utilisation typique des plug-ins est la suivante :

rrreee
Pour plus d'informations, veuillez consulter Exemple de documentation du plugin.

🎜🎜Méthode de mise à niveau 🎜🎜🎜🎜Exécutez l'outil de migration dans la base de code et recherchez le magasin . Exemples de on, store.off, store.emit. 🎜🎜🎜🎜🎜

🎜🎜Middleware 🎜Remplacement🎜🎜🎜🎜🎜🎜Le middleware est remplacé par un plugin. Le plug-in est une fonction de base qui reçoit store comme seul paramètre et peut surveiller les événements de mutation dans le magasin : 🎜rrreee🎜Pour plus de détails, veuillez consulter Documentation du plug-in. 🎜
🎜🎜Méthode de mise à niveau 🎜🎜🎜🎜Exécutez l'Outil de migration dans la base de code et recherchez les middlewares< Exemple d'option /code>. 🎜🎜🎜🎜🎜