如何通过Vuex实现复杂应用的状态集中管理？

本文共计1168个文字，预计阅读时间需要5分钟。

1. 为什么需要状态管理？一个Vue组件分为数据（model）与视图（view）。通过methods中的方法更新数据时，视图也会自动更新。+message.vue+template+div+{{message}}+button+@click=changeMessage 改变内容。

1 为什么需要状态管理

一个 Vue 组件分为数据（model）与视图（view）。当通过 methods 中的方法更新数据时，视图也会自动更新。

message.vue

<template> <div> {{message}} <button @click="changeMessage">改变内容</button> </div> </template> <script> export default { name: "message", data() { return { message: '你好' }; }, methods: { changeMessage() { this.message = '我很好' } } } </script>

效果：

这个示例中的 message 与 changeMessage() 只能在 message.vue 组件中使用。而在实际应用中，常见的就是跨组件共享数据的要求。