|
|
Опубліковано 2021-2-7 16:18:25
|
|
|
|
Коли велика кількість сторінок викликає однаковий результат перегляду, ми можемо інкапсулювати той самий контент у компонент перегляду, звісно, ми також можемо передавати параметри компоненту перегляду і повертати результат відповіді, сценарії: таблиці лідерів, форми, таблиці тощо. Ця стаття використовує asp.net core 3.1 для пояснення, як користуватися навчальним посібником компонента перегляду ViewComponent.
Переглянути компоненти
Компонент View схожий на локальний вигляд, але потужніший. Компонент view не використовує зв'язки моделі, а лише покладається на дані, які надаються при виклику моделі. Ця стаття була написана за допомогою контролерів і переглядів, але компонент перегляду також можна використовувати з Razor Pages.
Переглянути компоненти:
- Рендерити блоки замість повної відповіді.
- Включає те саме розділення проблем і переваги тестуваності, які спостерігаються між контролерами та поглядами.
- Вона може мати параметри та бізнес-логіку.
- Зазвичай викликається зі сторінки верстки.
Компоненти перегляду можна використовувати будь-де, де є багаторазова логіка рендерингу, надто складна для локального перегляду, наприклад:
- Динамічне меню навігації
- Хмара тегів (де запитується база даних)
- Панель входу
- Кошик для покупок
- Нещодавно опубліковані статті
- Зміст у бічній панелі у типовому блозі
- Панель входу з'являтиметься на кожній сторінці з посиланням для виходу або входу, залежно від статусу входу користувача
Частковий вигляд
У asp.net MVC 5 ми можемо використовувати локальний вигляд із наступним кодом:
Метод виклику:
ViewComponent є альтернативою локальним переглядам.
ViewComponent для початку
Переглянути клас компонентів:
- Ін'єкція залежностей конструктора повністю підтримується
- Не залучений до життєвого циклу контролера, тобто фільтри не можна використовувати в компонентах view
- Без зайвих слів, давайте одразу перейдемо до суті, де ми хочемо інкапсулювати функціональність компонентів класифікації міської території.
Спочатку створіть нову папку "ViewComponents" у каталозі проєкту та створіть новий файл класу "RootClassification.cs" з таким кодом:
На сторінці перегляду ми створюємо нову папку «Components» у папці «/Views/Shared» проєкту, потім створюємо нову папку «RootClassification» (це об'єкт із новим класом компонента, який ми створили), а потім створюємо новий файл «Default.cshtml», код виглядає так:
Структура виглядає так:
Детальний шлях: /Views/Shared/Components/RootClassification/Default.cshtml
Навіщо будувати такий шлях? Це пов'язано з тим, як працює компонент asp.net Core.
У процесі виконання пошук перегляду здійснюється наступним шляхом:
/Views/{Controller Name}/Components/{View Component Name}/{View Name}
/Views/Shared/Components/{View Component Name}/{View Name}
/Pages/Shared/Components/{View Component Name}/{View Name}
Ім'я перегляду за замовчуванням для компонента перегляду — Default, тобто ваш файл перегляду зазвичай називається Default.cshtml. При створенні результату компонента перегляду або виклику методу View ви можете вказати інше ім'я перегляду.
Викликаючи компонент, можна викликати там, де потрібно використати компонент, код виглядає так:
Повторно запустіть проєкт із наступним рендерингом:
|
Забити
-
Переглянути всі рейтинги
Попередній:EF Core Series (3) Атрибути тіні кадру сутності [Перевидання]Наступний:Вебсайт використовує плагін свайпер для реалізації слайд-шоу зображень (карусель)
|
Опубліковано 2021-8-12 10:21:01
|
Орендодавець|
Опубліковано 2023-8-13 17:55:05
|
