Asp.Net Core MVC 部分視圖與視圖組件

用部分視圖來顯示當(dāng)前日期

??部分視圖與普通視圖沒太大區(qū)別最筒,它可以將重復(fù)使用的HTML內(nèi)容結(jié)合起來晦鞋,可以單獨(dú)使用谋币。一般命名是在名稱前面加下劃線,放在/Views/Shared 目錄下训措。

  • 下面使用部分視圖來顯示日期伪节。

??Test控制器

    [Route("[controller]/[action]")]
    public class TestController : Controller
    {
        public IActionResult Default()
        {
            return View();
        }
    }

??Shared目錄下添加_showDate.cshtml。

<div style="padding:25px 20px;border:2px solid yellow;background-color:lightgoldenrodyellow">
    @DateTime.Today.ToString("yyyy'年'M'月'd'日'绩鸣,dddd")
</div>

??在Test目錄下添加Default.cshtml怀大。引用部分視圖可調(diào)用PartialAsync方法,并指定名稱呀闻。也可先使用@addTagHelper指令導(dǎo)入標(biāo)記幫助器類型化借,再使用標(biāo)記幫助器<partial>元素來指定引用部分視圖。

@addTagHelper *,Microsoft.AspNetCore.Mvc.TagHelpers
<html>
<body>
    <div>
        <h4>示例程序</h4>
    </div>
    <div>
        @await Html.PartialAsync("_showDate")
        <partial name="_showDate"/>
    </div>
</body>
</html>

使用視圖組件

??視圖組件(View Component)與部分視圖在功能上比較相似捡多,但視圖組件更靈活蓖康。與控制器相似,視圖組件可以實(shí)現(xiàn)視圖也代碼分離垒手,并且一個(gè)視圖組件可以返回多個(gè)視圖蒜焊。

??視圖組件有兩種實(shí)現(xiàn)方法:
??(1)直接從ViewComponent類派生,并包括Invoke或InvokeAsync方法科贬。
??(2)自定義類泳梆,需要在類上應(yīng)用ViewComponent特性,并包括Invoke或InvokeAsync方法榜掌。

??InvokeInvokeAsync方法是約定方法优妙,允許定義方法參數(shù),返回值類型需要實(shí)現(xiàn)IViewComponentResult接口憎账√着穑框架默認(rèn)實(shí)現(xiàn)了ViewViewComponentResulContentViewComponentResult

??對(duì)于Razor文檔胞皱,在需要呈現(xiàn)視圖組件的地方調(diào)用Component.InvokeAsync方法邪意。

??視圖組件會(huì)在以下路徑查找視圖:
??(1)共享組件:默認(rèn)位于 /Views/Shared/Components/<視圖組件名稱>/<視圖>.cshtml。共享視圖組件可以在應(yīng)用項(xiàng)目范圍內(nèi)訪問反砌。
??(2)非共享組件:默認(rèn)位于 /Views/<控制器名稱>/Components/<視圖組件名稱>/<視圖>.cshtml抄罕。非共享視圖組件只可在當(dāng)前控制器中訪問。

??定義視圖組件類Test于颖。視圖組件名可帶“ViewComponent”后綴呆贿,必須包含Invoke方法。

    public class TestViewComponent : ViewComponent
    {
        IHostingEnvironment m_env = null;
        public TestViewComponent(IHostingEnvironment env)
        {
            m_env = env;
        }
        public IViewComponentResult Invoke()
        {
            return View("_showInfo", m_env);
        }
    }

??定義Demo控制器做入。

    public class DemoController : Controller
    {
        public ActionResult Start()
        {
            return View();
        }
    }

??在Shared目錄下新建Components目錄,Components下新建Test視圖組件同名目錄同衣,添加_showInfo.cshtml竟块。

@model Microsoft.AspNetCore.Hosting.IHostingEnvironment

<div style="color:red;font-size:18px">
    <p>
        應(yīng)用程序名稱:@Model.ApplicationName
    </p>
    <p>
        當(dāng)前運(yùn)行環(huán)境:@Model.EnvironmentName
    </p>
</div>

??Views下建Demo目錄,添加Start.cshtml耐齐。

<html>
<body>
    <div>
        <h1>應(yīng)用主頁</h1>
    </div>
    <hr/>
    <div>
        <h3>以下為視圖組件:</h3>
        <h3>以下為視圖組件:</h3>
        @*第一種方法*@
        @await Component.InvokeAsync("Test")
        @*第二種方法*@
        @await Component.InvokeAsync(typeof(Demo.TestViewComponent))

        @*以下代碼不可取
        @{
            await Component.InvokeAsync("Test");
        }*@
    </div>
</body>
</html>
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末浪秘,一起剝皮案震驚了整個(gè)濱河市蒋情,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌耸携,老刑警劉巖棵癣,帶你破解...
    沈念sama閱讀 219,366評(píng)論 6 508
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異夺衍,居然都是意外死亡狈谊,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 93,521評(píng)論 3 395
  • 文/潘曉璐 我一進(jìn)店門沟沙,熙熙樓的掌柜王于貴愁眉苦臉地迎上來河劝,“玉大人,你說我怎么就攤上這事矛紫∈晗梗” “怎么了?”我有些...
    開封第一講書人閱讀 165,689評(píng)論 0 356
  • 文/不壞的土叔 我叫張陵颊咬,是天一觀的道長煎娇。 經(jīng)常有香客問我,道長贪染,這世上最難降的妖魔是什么缓呛? 我笑而不...
    開封第一講書人閱讀 58,925評(píng)論 1 295
  • 正文 為了忘掉前任,我火速辦了婚禮杭隙,結(jié)果婚禮上哟绊,老公的妹妹穿的比我還像新娘。我一直安慰自己痰憎,他們只是感情好票髓,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,942評(píng)論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著铣耘,像睡著了一般洽沟。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上蜗细,一...
    開封第一講書人閱讀 51,727評(píng)論 1 305
  • 那天裆操,我揣著相機(jī)與錄音,去河邊找鬼炉媒。 笑死踪区,一個(gè)胖子當(dāng)著我的面吹牛,可吹牛的內(nèi)容都是我干的吊骤。 我是一名探鬼主播缎岗,決...
    沈念sama閱讀 40,447評(píng)論 3 420
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼白粉!你這毒婦竟也來了传泊?” 一聲冷哼從身側(cè)響起鼠渺,我...
    開封第一講書人閱讀 39,349評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎眷细,沒想到半個(gè)月后拦盹,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,820評(píng)論 1 317
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡薪鹦,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,990評(píng)論 3 337
  • 正文 我和宋清朗相戀三年掌敬,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了惯豆。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片池磁。...
    茶點(diǎn)故事閱讀 40,127評(píng)論 1 351
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡,死狀恐怖楷兽,靈堂內(nèi)的尸體忽然破棺而出地熄,到底是詐尸還是另有隱情,我是刑警寧澤芯杀,帶...
    沈念sama閱讀 35,812評(píng)論 5 346
  • 正文 年R本政府宣布端考,位于F島的核電站,受9級(jí)特大地震影響揭厚,放射性物質(zhì)發(fā)生泄漏却特。R本人自食惡果不足惜,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,471評(píng)論 3 331
  • 文/蒙蒙 一筛圆、第九天 我趴在偏房一處隱蔽的房頂上張望裂明。 院中可真熱鬧,春花似錦太援、人聲如沸闽晦。這莊子的主人今日做“春日...
    開封第一講書人閱讀 32,017評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽仙蛉。三九已至,卻和暖如春碱蒙,著一層夾襖步出監(jiān)牢的瞬間荠瘪,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 33,142評(píng)論 1 272
  • 我被黑心中介騙來泰國打工赛惩, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留巧还,地道東北人。 一個(gè)月前我還...
    沈念sama閱讀 48,388評(píng)論 3 373
  • 正文 我出身青樓坊秸,卻偏偏與公主長得像麸祷,于是被迫代替她去往敵國和親。 傳聞我的和親對(duì)象是個(gè)殘疾皇子褒搔,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 45,066評(píng)論 2 355

推薦閱讀更多精彩內(nèi)容