24. Using View Components Flashcards
What are view components?
View components are classes that provide application logic to support partial views or to inject small fragments of HTML or JSON data into a parent view.
Why are view components useful?
Without view components, it is hard to create embedded functionality such as shopping baskets or login panels in a way that is easy to maintain.
How are view components used?
View components are typically derived from the ViewComponent class and are applied in a parent view using the custom vc HTML element or the @await Component.InvokeAsync() expression. Using the name of the view component class as the argument. View components can be used only in controller views or Razor Pages and cannot be used to handle requests directly.
Are there any pitfalls or limitations with view components?
View components are a simple and predictable feature. The main pitfall is not using them and trying to include application logic within views where it is difficult to test and maintain.
Are there any alternatives to view components?
You could put the data access and processing logic directly in a partial view, but the result is difficult to work with and hard to maintain.
How to apply View Components Using a Tag Helper?
Razor views and pages can contain tag helpers, which are custom HTML elements that are managed by C# classes.
View components can be applied using an HTML element that is view components can be applied using an HTML element that is.
The tag for the custom element is vc, followed by a colon, followed by the name of the view component class, which is transformed into kebab-case. Each capitalized word in the class name is converted to lowercase and separated by a hyphen so that CitySummary becomes city-summary, and the CitySummary view component is applied using the vc:city-summary element.
So you can write
with tag helper, instead of
@await Component.InvokeAsync(“CitySummary”)
How to apply View Components in Razor Pages
Razor Pages use view components in the same way, either through the Component property or through the custom HTML element.
Explain ViewViewComponentResult
This class is used to specify a Razor view, with optional view model data. Instances of this class are created using the View method.
Where are view components stored?
Notice that view components used in Razor Pages will find views defined in the Views/Shared/Components folder and that view components defined in controllers will find views in the Pages/Shared/Components folder. This means you don’t have to duplicate views when a view component is used by controllers and Razor Pages.
What is ContentViewComponentResult class used for?
This class is used to specify a text result that will be safely encoded for inclusion in an HTML document. Instances of this class are created using the Content method.
what is HtmlContentViewComponentResult class used for?
This class is used to specify a fragment of HTML that will be included in the HTML document without further encoding. There is no ViewComponent method to create this type of result.
When are asynchronous view components useful?
Asynchronous view components are useful when there are several different regions of content to be created, each of which can be performed concurrently. The response isn’t sent to the browser until all the content is ready. If you want to update the content presented to the user dynamically, then you can use Blazor, as described in Part 4.
