欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

[macOS开发.NET Core] 一个简单的WEB程序

程序员文章站 2022-07-11 07:51:17
上一篇咱们提到了在macOS下选进行开发。咱们已经把工具准备完成了。现在咱们做一个简单的DEMO创建WEB程序之前咱们已经创建过WEB程序,并且成功的运行过数据现在咱们创建一个页面,并显示出来。在咱们的系统中,最常见的应该是Grid列表。下面咱们创建一个列表界面Grid列表首先创建一个Model一... ......

上一篇咱们提到了在macos下选进行开发。
咱们已经把工具准备完成了。
现在咱们做一个简单的demo

创建web程序

[macOS开发.NET Core] 一个简单的WEB程序

之前咱们已经创建过web程序,并且成功的运行过数据

现在咱们创建一个页面,并显示出来。

在咱们的系统中,最常见的应该是grid列表。

下面咱们创建一个列表界面

grid列表

首先创建一个model
一个简单的用户类,非常简单

using system;

namespace web._01.models
{
    public class usermodel
    {
        /// <summary>
        /// id
        /// </summary>
        public int userid { get; set; }
        
        /// <summary>
        /// name
        /// </summary>
        public string username { get; set; }
        
        /// <summary>
        /// 注册时间
        /// </summary>
        public datetime regdatetime { get; set; }
        
        
    }
}

然后创建一个usercontroller

using system;
using system.collections.generic;
using microsoft.aspnetcore.mvc;
using web._01.models;

namespace web._01.controllers
{
    public class usercontroller : controller
    {
        // get
        public iactionresult index()
        {
            var user = new list<usermodel>();

            for (int i = 0; i < 10; i++)
            {
                user.add(new usermodel()
                {
                    userid = i,
                    username = i+1.tostring()+" name",
                    regdatetime = datetime.now.adddays(-i)
                    
                });
            }
            return view(user);
        }
    }
}

这里注意一点,首先给实体赋值,然后将数据返回给前台。

然后在views目录下创建一个user目录,再创建一个view
目录结构如下:
[macOS开发.NET Core] 一个简单的WEB程序

然后直接创建index
代码如下:

@model list<usermodel>

@{
    viewbag.title = "用户列表";
    layout = "_layout";
}

<h2>用户列表</h2>
<div class="panel panel-default todo-panel">
    <div class="panel-heading">@viewdata["title"]</div>

    <table class="table table-hover">
        <thead>
        <tr>
            <td>用户id</td>
            <td>用户名</td>
            <td>注册时间</td>
        </tr>
        </thead>

        @foreach (var item in model)
        {
            <tr>
                <td>@item.userid</td>
                <td>@item.username</td>
                <td>@item.regdatetime</td>

            </tr>
        }
    </table>
</div>

创建一个table,并生成数据。

ok,最后一步加入到导航条中。

在views>share目录下
[macOS开发.NET Core] 一个简单的WEB程序
加入导航栏中。

ok。咱们运行起来看一下效果。

[macOS开发.NET Core] 一个简单的WEB程序

点击咱们加入的新功能【用户列表】

效果如下:
[macOS开发.NET Core] 一个简单的WEB程序

至此,咱们新功能完成了。