asp.net core 学习笔记——视图的数据传递

视图

数据传递

  • ViewData:键值对、使用索引器来访问数据、支持任意类型
  • ViewBag:动态类型、是ViewData的封装、使用动态属性来访问数据
  • 如果ViewDataViewBag里面存放相同名称的数据会覆盖
using Microsoft.AspNetCore.Mvc;

namespace WebApplication1.Controllers
{
    public class TestController : Controller
    {
        // 右键方法名,"添加视图"即可快速添加视图
        public  IActionResult Index()
        {
            ViewData["IntTestData"] = 100;
            ViewData["StringTestData"] = "this is a string";

            ViewBag.IntTest2Data = 200;
            ViewBag.StringTest2Data = "this is other string";
            return View();
        }
    }
}

页面渲染

  • Razon语法:
    • @表示c#代码块或语句
    • @*注释*@
    • c#代码可与html代码混合
@{
    Layout = null;
}



<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Indextitle>
head>
<body> 
    @* 这是一行注释 *@
    @{ 
        int i = 0;
    }

    @* 获取ViewData里面的数据 *@
    @ViewData["StringTestData"]
    @* 获取ViewBag里面的数据 *@
    @ViewBag.StringTest2Data
body>
html>
  • 复杂数据类型的传递

控制器:

using System.Collections.Generic;
using Microsoft.AspNetCore.Mvc;

namespace WebApplication1.Controllers
{
    public class TestController : Controller
    {
        public  IActionResult Index()
        {
            List<string> lsData = new List<string>();
            lsData.Add("the first line");
            lsData.Add("the second line");
            lsData.Add("the third line");
            ViewBag.ListData = lsData;
            return View();
        }
    }
}

视图:

@{
    Layout = null;
}



<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Indextitle>
head>
<body> 
    <ul>
        @foreach (var item in ViewBag.ListData)
        {
            <li>@itemli>
        }
    ul>
body>
html>
  • Form表单提交

    • 传统html方式
    
    
    <html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <title>Indextitle>
    head>
    <body> 
        <form action="/test/checkuser" method="post">
            username: <input type="text" name="username" /><br />
            password: <input type="password" name="password" /><br />
                      <input type="submit" value="登录" />
        form>
    body>
    html>
    
    • HtmlHelper
    
    
    <html>
    <head>
        <meta name="viewport" content="width=device-width" />
        <title>Indextitle>
    head>
    <body> 
        <form action="/test/checkuser" method="post">
            username: @Html.TextBox("username")<br />
            password: @Html.Password("password")<br />
                      <input type="submit" value="登录" />
        form>
    body>
    html>
    

    控制器:

    using Microsoft.AspNetCore.Mvc;
    
    namespace WebApplication1.Controllers
    {
        [Controller]
        public class Test : Controller
        {
            public  IActionResult Index()
            {
                return View();
            }
            [HttpPost]
            public IActionResult CheckUser(string username, string password)
            {
                return Content($"username:{username} password:{password}");
            }
        }
    }
    
  • Form表单数据呈现

在Controller中放置数据

using Microsoft.AspNetCore.Mvc;

namespace WebApplication1.Controllers
{
    [Controller]
    public class Test : Controller
    {
        public  IActionResult Index()
        {
            ViewBag.Username = "xiaoming";
            return View();
        }
    }
}

在视图界面进行数据绑定

  1. html方式


<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Indextitle>
head>
<body> 
    <input type="text" name="username" value="@ViewBag.Username" />
body>
html>
  1. HtmlHelper方式


<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Indextitle>
head>
<body> 
    @Html.TextBox("username", (string)ViewBag.Username, null, new { attr1 = "value1" })
body>
html>

查看网页源代码(发现增加了attr1属性):



<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Indextitle>
head>
<body> 
    <input attr1="value1" id="username" name="username" type="text" value="xiaoming" />
body>
html>

你可能感兴趣的:(.net)