LUA mvc框架 mvc框架实例

转载

mob64ca140d96d9 2024-03-26 22:01:33

文章标签 LUA mvc框架 MVC ico html User 文章分类 游戏开发

一、直接看例子效果：

二、代码部分

1、在View-REG.cshtml

2、Modles——User.cs

3、Controllers——HomeController.cs

三、简单理解一下asp.net下的前端开发：

DEMO理解：

详细了解点：

一、直接看例子效果：

LUA mvc框架 mvc框架实例_ico

LUA mvc框架 mvc框架实例_MVC_02

MVC主要展示其主要部分的代码，具体的例子操作，已经有非常详细的解析链接：MVC实例具体操作步骤

二、代码部分

1、在View-REG.cshtml

@model alexzeng.Models.User

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title></title>
    <meta charset="utf-8" />
    <link href="~/Content/bootstrap.min.css" rel="stylesheet">
    <script src="~/Scripts/jquery-1.9.0.min.js"></script>
    <script src="~/Scripts/bootstrap.min.js"></script>


    <style>
        body {
            padding-top: 50px;
            color: #FFF;
            background: #444;
        }

        div {
            margin: 5px auto;
        }

        h1 {
            color: #fff;
        }

        #content {
            width: 100%;
            min-height: 600px;
            background: #444;
            padding-top: 20px;
            color: #FFF;
        }

        .register {
            padding: 20px;
            font-weight: 700;
            border: #FFF solid 1px;
            -moz-border-radius: 10px; /* Gecko browsers */
            -webkit-border-radius: 10px; /* Webkit browsers */
            border-radius: 10px; /* W3C syntax */
        }

        .col-sm-3 {
            line-height: 48px;
        }
    </style>
   
</head>
<body>
    <div id="content">
        <div class="container">
            @using (Html.BeginForm())
            {
                <div class="row">
                    <h1 class="col-md-6 col-md-offset-3 col-xs-10 col-xs-offset-1 page_title ">注册</h1>
                </div>
                <strong>@Html.ValidationSummary()</strong>
                <div class="col-md-6 col-md-offset-3 col-xs-10 col-xs-offset-1 register">


                    <div class="form-group">
                        <label for="username" class="col-sm-3 control-label">用户名：</label>
                        <div class="col-sm-8">
                            <div class="input-group">

                                @Html.TextBoxFor(x => x.Name, new { @class = "form-control", @placeholder = "请输入有效用户名" })
                                <div class="input-group-addon">
                                    <span class="glyphicon glyphicon-user"></span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="password" class="col-sm-3 control-label">密码：</label>
                      
                        <div class="col-sm-8">
                            <div class="input-group">

                                @Html.PasswordFor(x => x.PassWord, new { @class = "form-control", @placeholder = "请输入有效密码" })
                                <div class="input-group-addon">
                                    <span class="glyphicon glyphicon-lock"></span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="chkpwd" class="col-sm-3 control-label">电话：</label>
                        <div class="col-sm-8">
                            <div class="input-group">

                                @Html.TextBoxFor(x => x.phone, new { @class = "form-control", @placeholder = "请输入有效电话" })
                                <div class="input-group-addon">
                                    <span class="glyphicon glyphicon-phone"></span>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="email" class="col-sm-3 control-label">邮箱：</label>
                        <div class="col-sm-8">
                            <div class="input-group">

                                @Html.TextBoxFor(x => x.email, new { @class = "form-control", @placeholder = "请输入有效邮箱" })

                                <div class="input-group-addon">
                                    <span class="glyphicon glyphicon-envelope"></span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-md-3 col-md-offset-3 col-xs-12">
                        <button type="reset" class="btn btn-default btn-block">
                            <b>清空</b>
                            <span class="glyphicon glyphicon-remove"></span>
                        </button>
                    </div>
                    <div class="col-md-3 col-xs-12">
                        <button type="submit" class="btn btn-info btn-block">
                            <b>注册</b>
                            <span class="glyphicon glyphicon-arrow-right"></span>
                        </button>
                        
                    </div>
                </div>
            }
        </div>
    </div>
</body>
</html>

2、Modles——User.cs

namespace alexzeng.Models
{
    public class User
    {

        public int Id { get; set; }
        [Required(ErrorMessage = "请输入用户名。")]
        public string Name { get; set; }
        [Required(ErrorMessage = "请输入密码。")]
        public string PassWord { get; set; }
        [Required(ErrorMessage = "请输入电话。")]
        public string phone { get; set; }
        [Required(ErrorMessage = "请输入Email。")]
        [RegularExpression(".+\\@.+\\..+", ErrorMessage = "请输入正确的Email地址")]
        public string email { get; set; }
       
    }

}

3、Controllers——HomeController.cs

[HttpGet]
        public ActionResult REG()
        {
            return View();
        }

        [HttpPost]
        public ActionResult REG(User user)
        {
            if (ModelState.IsValid)
            {
                return View("Thank", user);
            }
            else
            {
                return View();
            }
        }

三、简单理解一下asp.net下的前端开发：

1、Asp.net webforms 开发快速，有控件可以拖，前后端交互方式简单；可定制化不佳，UI样式美化不易，性能较低，大部分操作都会刷新页面。——这个在前面的牛腩的例子中应用过

2、Asp.net MVC 开发较快速，灵活控制，性能高；对技能要求较多，需要掌握js，css，html等内容。——在福分系统中应用了

3、纯html+js + Asp.net WebApi (前后端分离)，高性能，多端可复用；对js的要求较高，大部分逻辑前置

一般来说，.Net下开发WEB就大概这么几种方式，当前的话，一般2和3用的比较多

DEMO理解：

这个例子并没有真正和数据进行交互，写了一个死实体Models,通过Controllers的GET、PUT请求，在方法中进行逻辑判断和验证 if (ModelState.IsValid)。在View中，根据Controller 里面的请求和判断，最后可以展示给用户响应的提示信息，可以看出，主要的页面显示都写在的View—中的.cshtml中：这里包含了CSS样式，JS，html 。另外，aspx 中我们经常使用 <% test; %>这种，在 cshtml 中则改为 @{ test; } 这种更为简洁的写法。