C# html使用三层架构将后端得到的数据库数据显示在前端页面

使用三层架构将后端得到的数据库数据显示在前端页面，可以更好地实现代码的分层和复用。三层架构通常包括数据访问层、业务逻辑层和表示层。以下是一个简单的示例：

1. 数据访问层

数据访问层负责与数据库进行交互，定义了一些用于数据操作的方法。例如：

public class MyRepository
{
    // 连接数据库
    private SqlConnection connection = new SqlConnection("connection string");

    // 获取数据
    public List<MyModel> GetData()
    {
        List<MyModel> data = new List<MyModel>();

        // 打开数据库连接
        connection.Open();

        // 执行SQL语句，获取数据
        SqlCommand command = new SqlCommand("SELECT * FROM MyTable", connection);
        SqlDataReader reader = command.ExecuteReader();
        while (reader.Read())
        {
            MyModel item = new MyModel();
            item.Field1 = reader.GetString(0);
            item.Field2 = reader.GetInt32(1);
            item.Field3 = reader.GetBoolean(2);
            data.Add(item);
        }

        // 关闭数据库连接
        reader.Close();
        connection.Close();

        return data;
    }
}

在这个数据访问层中，我们定义了一个名为MyRepository的类，用于获取数据库中的数据。我们使用了SQL语句来执行查询操作，并使用SqlDataReader对象来遍历查询结果，并将查询结果转换为MyModel对象并添加到List中，最后返回List。

2. 业务逻辑层

业务逻辑层负责处理业务逻辑，对数据进行处理和计算，并调用数据访问层来获取数据。例如：

public class MyService
{
    // 获取数据
    public List<MyModel> GetData()
    {
        MyRepository repository = new MyRepository();
        return repository.GetData();
    }
}

在这个业务逻辑层中，我们定义了一个名为MyService的类，用于处理业务逻辑。我们调用了数据访问层中的GetData方法来获取数据库中的数据，并返回查询结果。

3. 表示层

表示层负责与用户进行交互，接收用户的请求，并调用业务逻辑层来处理请求并获取数据。例如：

public class MyController : Controller
{
    // 获取数据
    public ActionResult Index()
    {
        MyService service = new MyService();
        List<MyModel> data = service.GetData();
        return View(data);
    }
}

在这个表示层中，我们定义了一个名为MyController的控制器，用于处理用户的请求。我们调用了业务逻辑层中的GetData方法来获取数据库中的数据，并将数据传递给视图。

4. 视图

视图负责将数据显示给用户。例如：

@model List<MyModel>

<table>
    <thead>
        <tr>
            <th>字段1</th>
            <th>字段2</th>
            <th>字段3</th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model)
        {
            <tr>
                <td>@item.Field1</td>
                <td>@item.Field2</td>
                <td>@item.Field3</td>
            </tr>
        }
    </tbody>
</table>

在这个视图中，我们定义了一个表格，用于显示从后端传递过来的数据。我们使用了Razor语法来绑定HTML页面和后端传递过来的数据，使用@foreach循环来遍历数据，并使用@item.Field1、@item.Field2等语法来显示数据的具体字段。

综上所述，使用三层架构将后端得到的数据库数据显示在前端页面，可以实现代码的分层和复用，更加灵活和易于维护。