我理解这个MVC吗?

时间:2016-10-25 18:53:42

标签: symfony reactjs redux

我正在与其他开发人员的帮助重构一个大型网络应用。在我看来,后端的组织如下:

Symfony PHP:   controller
PostgreSQL DB: model

据我了解,客户端浏览器是'视图'服务器。

前端另外组织如下:

Redux.js:  model + controller          // this is all mildly simplified
React.js:  view

因此,在概念上将客户端浏览器视为服务器状态的视图是正确的,而且,浏览器维护自己的状态,控制器和服务器端数据的视图?

我是服务器端"专家" (强调引号),而我的助手是前端专业人士。我们故意尝试将前端和后端分开,并将交互限制在初始页面加载之外的JSON有效负载上。如果我正确地看待项目的全球组织,它将真正帮助我组织我们的主代码库。

3 个答案:

答案 0 :(得分:0)

听起来不错。

应用程序的状态

React组件保持内部状态。事件(例如点击,鼠标移动,键盘输入,超时,AJAX响应等)通过this.setState更新状态。调用this.setState时,将调度组件的整个重新渲染,然后重新绘制组件。

这个循环还在继续。您可以将React的状态视为传统的LAMP Web应用程序,也就是说,在示例Web应用程序中,用户提交表单,页面将使用新内容进行更新。只有这样而不是你设置了监听器,并且imperatively通过传统的LAMP应用程序告诉你要传递给this.setState的数据,你在HTML声明中做declaratively {/ 1}},在您定义的输入中。

虽然,上面的React vs LAMP示例可能是一个不好的比喻,因为React不能直接与服务器一起使用。您有责任设计代码以使用服务器。

与服务器的通信

因此,使用LAMP,如果您希望用户输入在服务器上保留,则只需记录表单POST请求中的输入。

通过反应,你可以采取额外措施。

当用户触发事件(点击,鼠标移动,键盘输入等)时,您首先需要发出一个AJAX请求,当然,服务器将根据请求(例如存储表单输入)执行操作。

在(成功)响应回调中,您将调用<form>来更新服务器响应的内容。使用传统的LAMP应用程序,您将获得使用用户持久数据呈现的全新网页。相反,使用React可以获得一些不是网页的数据(可能是JSON或XML),但前端应用程序会使用它来确定页面的外观。

答案 1 :(得分:0)

我认为将客户端应用视为服务器端状态的视图特别有用。

客户端是它自己的MVC应用程序。严格来说,我不认为react-redux实际上是MVC。它被认为是MVC的替代品。 React是MVC中的View,也是Controller的一小部分,而redux是使用Model的一种看法。你应该在这里阅读更多内容:http://redux.js.org/docs/introduction/Motivation.html

客户端M与服务器端M

的关系

也许另一种思考方式是服务器有一个&#39;模型&#39;而redux状态树的一部分实际上是对该模型的一种看法。 (就像从服务器端派生并与todo表保持同步的待办事项列表)。

redux状态树的某些部分也可能与服务器端模型&#39;无关。并且可以用于存储客户端状态(如当前的URL /路由)。

我坚信,不要过分担心术语,坚持第一原则。服务器具有状态,客户端应用程序具有状态。客户端应用程序状态的一部分是从服务器端状态派生和/或同步的。客户端应用程序状态的其余部分有助于生成用户看到的UI。当用户与应用程序交互时,会触发操纵状态的代码。一旦你编写了一个简单的react-redux应用程序,你就会看到所有这些内容的去向!

答案 2 :(得分:0)

  

因此,从概念上讲,考虑客户端是正确的   浏览器作为服务器状态的视图,进一步说明了   浏览器维护自己的状态,控制器和视图   服务器端数据?

是的,这是完全正确的。

事实上,您可以将您的Web应用程序视为一个MVC,它位于另一个MVC(浏览器)中,然后在另一个MVC(OS窗口系统)中执行。它通过网络(您的后端应用程序)与另一个MVC进行通信。

现在,交换MVC用于“软件设计模式的实现”,因为没有关于MVC的规范定义。有许多变体,例如,服务器中的MVC与客户端计算机中的MVC完全不同。

  

服务器端方法基于所谓的Java Model 2.这种设计与MVC具有相同的理念,并且其大多数组件与它类似,因此我们都将其称为MVC。这不是不正确的,虽然也不准确。

     

http://givan.se/mvc-past-present-and-future/#server-mvc

您可以在此处比较属于MVC集合的所有已记录模式: http://mvc.givan.se/