vue.js - Vue Instance/Component 只是 MVVM 中的 ViewModel 吗？

Question

来自 Vue Docs :

In Vue.js, every Vue instance is a ViewModel.

在阅读了很多关于 MVC、MVP 和 MVVM 等设计模式的文章后，我对此有点困惑。

我们都知道，在 Vue 实例或 Vue 组件(也是 Vue 实例)中，我们有 <template> ，它使用基于 HTML 的语法。 这部分不是MVVM中的View吗？

还有data() , computed在 Vue 组件中。 不就是MVVM中的Model吗？

下面是一个Vue SFC的结构，我把它分为Model、View和ViewModel。如果它有什么问题。请帮助我纠正这个问题，并帮助我在使用基于 MVVM 的 JavaScript 框架时更多地理解 MVVM。

<template>
    <!-- the template part should be the View in MVVM since they don't contain any business logic but only the UI components. Which perfectly match the description of the View in MVVM.-->
</template>
<script>
export default = {
    data () {
        return {
            // the data should be the Model in MVVM, because they stand for their own and are the "actually" content of the app
        }
    },
    computed: {
        // computed properties should also be the Model in MVVM. When using vuex, I can, for example, get data with HTTP GET request through the vuex actions and parse the data, store it in the vuex store. When I need to use them, I get them from the computed in any child component I would like to.
    },
    methods: {
        // this should belong to the ViewModel in MVVM.
    }
}
</script>
<style scoped>
/* the style should be the View in MVVM. Because they are only responsible for how to present the data to the user.*/
</style>

因此，我认为 store.js (用于vuex作为集中状态管理)也属于Model。因为它包含了几乎所有的业务逻辑，并保存了我们从其他 API 或用户那里获取的数据。

所以毕竟，当我们阅读时，一个框架是基于 MVVM 或 MVC 或 MVW(Angular 说:Model View Whatever)。 它的真正含义是什么，它对实际的 Web 开发是否重要？

Answer 1

我个人认为，对于一个基本的 vue 实例，您不应该真正深入阅读设计模式。

构建大型vue应用时，涉及到多个vuex状态模块和api层。你可以考虑一下设计模式。但我觉得这对于 vue web 应用程序来说仍然是微不足道的。请参阅下面有关某种答案的信息(如果我错了，请纠正我)。

模板 - 查看

数据 & vuex 存储状态 - 模型

getters & computed - ViewModel

Action & apiLayer - ViewController

突变 - ViewController -> ViewModel

viewController - 当 View 执行操作时，它会写入模型。就像启动到后端的数据获取并使用获取的数据填充模型。