Skip to main content

基础概念

SPA应用

组件通讯

单向绑定(单向数据流)

官方定义:

数据总是从父组件传到子组件,子组件没有权利修改父组件传过来的数据,只能请求父组件对原始数据进行修改。这样会防止从子组件意外改变父级组件的状态,从而导致你的应用的数据流向难以理解。

如果实在要改变父组件的 prop 值 可以再 data 里面定义一个变量 并用 prop 的值初始化它 之后用$emit 通知父组件去修改

我的理解:

“单项数据流”,数据的流动是单向的,从父级流向子级,可以是一对一,一对多,子级是无法以任何形式发起修改数据,数据以只读的形式进行传递,数据的修改只能在最上层的父级进行,数据每次修改都会同步更新所有子级数据,实现同步更新。

vue中实现单向数据的主要方式有:

  • prop绑定数据向下传递,同时监听emit事件来实时更新数据,所有操作都在父组件上完成

MVC

  • 官方解释:

    MVC 全名是 Model View Controller,是模型(model)-视图(view)-控制器(controller)的缩写,一种软件设计典范

  • M模型(Model)

    模型层一般负责与数据库通讯,对常用的数据库校验,数据库增删改查进行统一管理,保证代码的低耦合,高可用复,如果项目的体量比较大,还会在Model下再细分成模型层(model)和服务层(Service)。

  • V视图(VIew)

    只要负责将数据渲染到模版上,所以使用php或者python的web框架,基本都会配搭一些模版渲染引擎,

  • C控制器(Controller)

    主要验证客户端的请求是否合理,将客户端发过来的进行处理,然后根据请求调用不同的数据层,再将数据层返回的数据进行统一整合或者处理,调用对应的视图将数据最终渲染到模版上,返回给客户端

MVC 的思想:一句话描述就是 Controller 负责将 Model 的数据用 View 显示出来,换句话说就是在 Controller 里面把 Model 的数据赋值给 View。

传统MVC的设计模式,前后端的分工并不明确,随着前后端分离的发展,后端的MVC也发生了非常大的变化,现代的MVC解构,前端(使用vueRerect等)负责静态页面的编写,并调用后端准备好的数据接口(即ResultAPI)将数据实时渲染到页面中,后端不再使用模版+数据的形式,只需要准备好数据供前端调用即可

MVVM

Model 数据层

View 视图层

ViewModel 数据视图层

区别

双向绑定

响应式原理

状态管理(vuex、pinia)