ASP.NET Core MVC 뷰 구성 요소(View Component)

1. 뷰 구성 요소 소개
뷰 어셈블리는 ASP입니다.NET Core MVC의 새로운 기능은 부분 뷰와 유사하지만 더 강력합니다.보기 구성 요소는 모델 연결을 사용하지 않고 호출할 때 제공하는 데이터에만 의존합니다.
뷰 어셈블리 특성:
전체 응답이 아닌 블록
컨트롤러와 보기 사이에서 발견된 동일한 관심사와 테스트 가능한 장점을 포함한다
매개 변수와 업무 논리를 보유할 수 있다
일반적으로 배치 페이지에서 호출
 
뷰 구성 요소는 로직을 반복해야 하고 로컬 뷰에 너무 복잡한 경우(예:
동적 탐색 메뉴
태그 클라우드(데이터베이스 조회 필요)
로그인 패널
카트
최근에 발표된 글
전형적인 블로그의 사이드바 내용
각 페이지에 표시되는 로그인 패널은 사용자의 로그인 상태에 따라 로그아웃 또는 로그인 링크를 표시합니다.
 
보기 구성 요소는 두 부분으로 구성되어 있는데, 클래스 (보통 ViewComponent에서 파생된 것) 와 되돌아오는 결과 (보통 하나의 보기) 이다.컨트롤러와 마찬가지로 보기 구성 요소는 POCO일 수 있지만 대부분은 ViewComponent를 이용하여 파생하는 방법과 속성이다.
 
2. 뷰 어셈블리 생성하기
(1) 뷰 어셈블리 클래스
일반적으로 뷰 어셈블리 클래스는 다음 방법 중 하나로 생성할 수 있습니다.
ViewComponent에서 파생됨
[ViewComponent] 속성 장식 클래스를 사용하거나 [ViewComponent] 속성이 있는 클래스에서 파생
이름 접미사가 ViewComponent로 끝나는 클래스를 만듭니다.
컨트롤러처럼 보기 구성 요소는 퍼블릭, 비플러그인, 비추상적이어야 합니다.보기 구성 요소 이름은 ViewComponent 접미사를 삭제한 클래스입니다. ViewComponent Attribute를 사용할 수 있습니다.Name 속성은 지정을 표시합니다.
　　
뷰 어셈블리 클래스의 이점:
구조 함수 의존 주입 완전 지원
컨트롤러의 생명주기에 참여하지 않습니다. 이것은 보기 구성 요소에서 필터를 사용할 수 없음을 의미합니다.
 
(2) 보기 구성 요소 방법
보기 구성 요소는 InvokeAsync 방법에서 논리를 정의하고 IViewComponentResult로 돌아갑니다.매개 변수는 모델 귀속이 아니라 보기 구성 요소에서 직접 호출됩니다.보기 구성 요소는 요청을 직접 처리하지 않습니다.일반적으로 뷰 구성 요소는 뷰를 호출하여 모델을 초기화하여 뷰에 전달합니다.한 마디로 하면 뷰 어셈블리의 특징은 다음과 같습니다.
InvokeAsync 방법을 정의하고 IViewComponentResult로 돌아갑니다.
일반적으로 ViewComponent View를 호출하여 모델을 초기화하여 뷰에 전달합니다.
매개변수는 모델 바인딩이 없는 HTTP 대신 호출 방법에서 파생됩니다.
HTTP 노드로 직접 접근할 수 없습니다. 코드에서 호출됩니다.보기 구성 요소가 요청을 처리하지 않습니다.
현재 HTTP 요청의 세부 사항이 아닌 서명에 다시 로드합니다.
 
(3) 뷰 검색 경로
런타임 시 다음 경로에서 뷰를 검색합니다.
　　Views//Components//
　　Views/Shared/Components//
보기 구성 요소의 기본 보기 이름은Default입니다. 이것은 보기 파일의 이름이Default이라는 것을 의미합니다.cshtml.보기 구성 요소 결과를 만들거나 보기 방법을 호출할 때 다른 보기 이름을 지정할 수 있습니다.
 
3. 보기 구성 요소 호출
보기 구성 요소를 사용하려면 보기에서 @Component를 호출하십시오.InvokeAsync(뷰 어셈블리 이름).매개변수가 InvokeAsync 메서드로 전달됩니다.다음과 같습니다.

@await Component.InvokeAsync("TopicRankList",new { days=5})

보기 구성 요소는 보통 보기에서 호출되지만, 컨트롤러 방법에서 직접 호출할 수도 있습니다. 비록 보기 구성 요소는 컨트롤러처럼 종결점을 정의하지 않지만.

        public ActionResult Index()
        {
            return ViewComponent("TopicRankList", new { days = 5 });
        }

 
4. 실전 보기 구성 요소
ViewCompoents 폴더를 추가하고 UserRankList 클래스를 추가합니다.

    public class UserRankList : ViewComponent
    {
        private readonly DataContext _db;
        private IMemoryCache _memoryCache;
        private string cacheKey = "topicrank";

        public UserRankList(DataContext db, IMemoryCache memoryCache)
        {
            _db = db;
            _memoryCache = memoryCache;
        }

        public IViewComponentResult Invoke(int days)
        {
            var items = new List();
            if (!_memoryCache.TryGetValue(cacheKey, out items))
            {
                items = GetRankUsers(10, days);
            }
            _memoryCache.Set(cacheKey,items,TimeSpan.FromMinutes(10));
            return View(items);
        }

        private List GetRankUsers(int top, int days)
        {
            return _db.User.OrderBy(o => o.Id).Take(top).ToList();
        }
    }

보기 구성 요소 클래스는 프로젝트의 모든 폴더에 있습니다.[ViewComponent] 특성은 보기 구성 요소를 참조하는 데 사용되는 이름을 변경할 수 있습니다. 예를 들어, 클래스를 XYZ로 명명하고 [ViewComponent] 특성을 적용할 수 있습니다.

[ViewComponent(Name="UserRankTop")]
public calss XYZ:ViewComponent

Invoke 메서드는 목록을 반환하고 뷰 어셈블리 뷰를 생성합니다.
View/Shared/Components 폴더를 만듭니다.이 폴더의 이름은 Components여야 합니다.그런 다음 UserRankList 폴더를 만들고 Default을 추가합니다.cshtml 보기:

@model List<MVCTest.Models.User>

<h2>userh2>
<div class="list-group">
    @foreach (var item in Model)
    {
        <label>@item.Namelabel>
    }
div>

마지막으로 보기에서 호출: @await Component.InvokeAsync("UserRankList", new { days=5})