The name 'Component' does not exist in the current context

Question

I’m trying to create a Component view to reuse on the pages, I’m trying to follow some video tutorials. I’ve installed via nuget the entire Microsoft.AspNetCore.Mvc, but when I try to call it from the viewpage, using

@Component.InvokeAsync("Componente")

I have the error

The name 'Component' does not exist in the current context

I’m using VS2017, Asp.net mvc 5. Does anyone know what might be missing? Install something else I don’t know? Or in mvc 5 is otherwise the Component call?

When I start typing Compon and pressing Ctrl+space should appear the list of options including the Component as shown in the following image, note that Component is not appearing:

Answer 1

In your case the problem is why View Components is an appeal lodged at MVC 6 and Asp.Net 5 and its application is actually a MVC5 with Asp.Net 4

Below is an example of the implementation in Dotenetcore (reference).

First create a directory, at the root of your MVC application, called Componentsview and add a new class called ComponenteViewComponent that must inherit from ViewComponent

public class ComponenteViewComponent : ViewComponent
{

    public async Task<IViewComponentResult> InvokeAsync()
    {
        return View();
    }
}

If you do not respect the suffix Viewcomponent the MVC will not recognize it as such and maybe there may be your first problem. If you created the class by calling only Componente, you need to add an annotation so that the component is recognized by that name.

[ViewComponent(Name = "Componente")]
public class Componente : ViewComponent
{

    public async Task<IViewComponentResult> InvokeAsync()
    {
        return View();
    }
}

Note the points above and after creating the class, go to the directory /Views/Shared/, add the directory Components and inside it another folder called Component, which is the name of its component.

Inside the folder Component add to PartialView calling for Default, my example I just added the following html snippet:

<h1>Olá eu sou um componente</h1>

Finally its structure must be like this:

Now, in any view of your site you can invoke your component, in my case I added the snippet at the top of Homecontroller’s Index view:

<div>
    @await Component.InvokeAsync("Componente")
</div>

And that’s the result: