call a viewcomponant from plugin error in 4.6

dear Sagar,
i am .net developer and i am new to nocommerce my company need to upgrade plugin from 4 to 4.6 so i am trying to do so

i dont know the flow for plugins in v 4.6
but i am facing problems :(
please help me if u can.
the old plugin structure was that the view component is inside the plugin and the developer who made this plugin was calling the viewcomponent
inside public store custom view called paymentcheckout.cshtml

@model Nop.Plugin.Payments.PayTabs.Models.PayTabsModel
@using Nop.Core
@using Nop.Plugin.Payments.PayTabs.Components
@inject IWebHelper webHelper
@{
    Layout = "_ColumnsOne";

    //scripts
    //Html.AddScriptParts(ResourceLocation.Footer, "~/js/public.accordion.js");
    //Html.AddScriptParts(ResourceLocation.Footer, "~/js/public.onepagecheckout.js");

    var storeLocation = webHelper.GetStoreLocation();

    //title
    NopHtml.AddTitleParts(T("PageTitle.Checkout").Text);
    //page class
    NopHtml.AppendPageCssClassParts("html-checkout-page");
}
<div class="page checkout-page">
    <div class="page-title">
        <h1>@T("Checkout")</h1>
    </div>
    <div class="page-body checkout-data">
        @if (TempData["CartIsEmpty"] == null)
        {
            @await Component.InvokeAsync(typeof(PayTabsViewComponent))
        }
        else
        {
        <div class="alert alert-danger alert-dismissible" role="alert">
            <button type="button" class="close" data-dismiss="alert" aria-label="Close">
                <span aria-hidden="true">×</span>
            </button>
            <h4><span class="glyphicon glyphicon-warning-sign"></span> @T("Common.Warning")</h4>
            @TempData["ErrorMessage"]
        </div>
        }
    </div>
    <script type="text/javascript" asp-location="Footer">

    </script>
</div>

and the view component is returning another view
it said he cannot find PayTabsViewComponent as its in the plugin

Hello

If you are added public store view file in plugin component, then remove it.
And add your custom widgetzone on view page.

@await Component.InvokeAsync(typeof(WidgetViewComponent), new { widgetZone = "PayCheckoutTabs", additionalData = Model })

This widgetzone through you will call your ViewComponent class.
For this you need to change in plugin.
If you haven't added IWidgetPlugin in plugin then add plugin file.
then add GetWidgetZonesAsync() method in "PayCheckoutTabs" widgetzonne.

public Task<IList<string>> GetWidgetZonesAsync()
        {
            return Task.FromResult<IList<string>>(new List<string> { "PayCheckoutTabs" });
        }

And call your viewcomponent type in GetWidgetViewComponent() method.

public Type GetWidgetViewComponent(string widgetZone)
        {
            return typeof(PayTabsViewComponent);
        }

With this you can achieve your requirement.

i am not using public store view inside the plugin.
what do u mean by
@await Component.InvokeAsync(typeof(WidgetViewComponent), new { widgetZone = "PayCheckoutTabs", additionalData = Model })
do i need to create these two files
i mean WidgetViewComponent and PayCheckoutTabs ?
and if so how and where

Normally the way to build a new plugin is using an existing plugin and edit it
Then you install the Plugin  

No you do not reference the Plugin in Nop.Web
The Plugin can reference Nop.Web.Framework and Nop.Web if required (See exising Plugins)

It is not clear if it is Payment plugin - where a customer makes a payment
Or is it in Admin doing something with payments

dear Yidan
its payment plugin
and its calling viewcomponent to render new payment view insteade of core view
and this plugin was old and my company told me to upgrade it
so please help
as i dont the normal flow of the plugins
as i said the old one was just calling the viewcomponent in the view inside nop.web and the viewcomponent it returning the plugin view how it works in v 4.6

A lot of payment plugins have a Public View and use a View Component for the display of something to the customer
I think you are best to have a look and study the operation of the Nop.Plugin.Payments.Manual plugin
It has a View Component to let the customer enter the Credit Card details
I don’t know what your plugin is doing in the view but maybe it is similar

Or another payment plugin which loads a script before the Payment View Component is Nop.Plugin.Payments.PayPalCommerce - It uses the Widget Zone trigger the loading of the script