初识MVC框架

r囧r小猫 2022-08-14 03:44 243阅读 0赞

MVC框架

是一个框架模式，它使应用程序的输入、处理和输出分开。它可以使业务逻辑、数据、界面显示分离，使得耦合度大大降低，在这一方面与“三层”思想类似。

**     M——Model（模型）  **

要处理的业务代码和数据操作代码，模型对象负责在数据库中存取数据。

注意：模型层并非是三层架构中的Model层。在三层中，Model层中是实体。而在MVC中，Model中既有业务逻辑又有对数据的各种操作代码，因此，如果非要比较的话，它更像是三层中B层与D层的结合。

**      **

**      V——View（视图）**

主要与用户打交道的，负责数据显示

**       C——Controller （控制器）**

Model和View之间的桥梁，它来决定决定调用哪个Model加载哪个视图。控制器本身不输出任何东西和做任何处理。它只是接收请求并决定调用哪个模型去处理请求，然后再确定用哪个视图来显示返回的数据。控制器类似一个中间者，负责传话的那个人。

简单了解以后，我们来看一下如何建立一个MVC项目。如下图：

![Center][]

点击确定以后，新建的项目中会如下图所示：

![Center 1][]

用红色框标出的是前面所说的M-V-C，App\_Data 与一般的ASP.NET website是一样的，用于存放数据。Content 这个目录是建议用来存放一下资源文件的。例如CSS、JS、图片等等。其他的文件夹如Images、Filters就不用介绍了。

下面通过一个小例子来简单看一下MVC的神奇之处。

1、在Model文件夹中新建一个类HelloWorldController，会自动生成一个Index方法。

![Center 2][]

2、在它的Index方法中右键添加视图，名称为Index.cshtml.(cshtml是扩展名)。

3、在Model中添加Movie模型类，代码如下

namespace MvcMovie.Models
    {
        public class Movie
        {
            //稍后要在浏览器中显示的字段
            public int ID { get; set; }
            public string Title { get; set; }
            public DateTime ReleaseDate { get; set; }
            public string Genre { get; set; }
            public decimal Price { get; set; }
        }
    
        //负责在数据库中的操作，继承自Entity Framework的DbContext基类
        public class MovieDBContext : DbContext
        {
            public DbSet<Movie> Movies { get; set; }
        }
    }

4、创建数据库连接

在web.config中的<connectionStrings>中添加

5、创建一个新的类MoviesController控制器，它的作用是获取数据并使用视图将数据显示在浏览器中。

右击Model文件夹，如下图所示，图中的类都是之前动手创建的类：

![Center 3][]

运行程序，在地址栏后加上 /Movies，回车即出现下图：

![Center 4][]

单击Create New,进入添加电影页面，各字段都是之前Movies中的。

![Center 5][]

添加成功，回到VS中。在运行过程中，向Movies控制器请求，从而返回Movies电影数据库表中的所有记录，然后将结果传递给Index视图。

最后，我们看一下新添加的那一条电影信息到哪里去了。

在右面的解决方案中，找到一个以.mdf结尾的，如图

![Center 6][]

打开之后，看到十分熟悉的界面。

![Center 7][]

接着打开Movies，看到其中的数据。

![Center 8][]

**小结：**

对于MVC，目前只是初步的了解，还是一知半解的状态。但是跟着一个一个小Demo做，还是蛮有成就感的，期待下一步在项目中更多的实践。

[Center]: /images/20220810/7400275153d34c6f9eb3c3714763162e.png
[Center 1]: /images/20220810/424475ab0c4346bc98cd845f88898272.png
[Center 2]: /images/20220810/fb2c6958f00d40659e81dda2bd9b2562.png
[Center 3]: /images/20220810/9086908a62924fad9119ea94b5477ca4.png
[Center 4]: /images/20220810/3d5138bde8fe4ca78ab62192281e1e1b.png
[Center 5]: /images/20220810/cf3154cc9625489881676fa8748241c8.png
[Center 6]: /images/20220810/129dcbbc68d9438b94241ac91e0add53.png
[Center 7]: /images/20220810/ef763ed452474667a3a171aca15c759d.png
[Center 8]: /images/20220810/5f1671ae9e4e48f6b47b62b0daf78832.png