分离卡片的最佳方法是什么？

Question

• 我有一个电子商务类型的解决方案，在 index.cs 上我确实有 我的模型并从索引.cshtml 上的数据库检索数据。

• 我通过连接表进行了一些进一步的数据操作以获取顶部 已售出、新增等...

在 foreach 循环中，我以一些漂亮的布局显示产品。 效果很好。然而现在我想在该循环中加入不同的产品卡类型，以打破单调的外观。

• 所以我想将产品卡分成自己的.cshtml。

但是，对于 index.cshtml 页面上的所有对象和逻辑，将其转换为剃刀组件或部分组件将需要大量工作，因为我需要向其中传递很多内容。
在 PHP 中这很容易。

有没有其他小部件我可以简单地做：

foreach(var prod in products)
{include prodcard.cshtml} 
if(prod.special=true){{include prodcard2.cshtml} 
}

它可以在哪里访问所有父级变量和对象？

一些实际代码：

 foreach (var w4 in ofstatus4)
{
ctaCards = GlobalHelp.GetCTAText(w4.Type);
double storeCoupon, itemRate, salePrice = 0;

string zip, lat, lng;
(string, string) exLink;
exLink.Item1 = "";
exLink.Item2 = "";
string itemPicUrl = "/IM/*/" + w4.EMID.ToString() + "/" + Model.Referrer;
string browserTarget = "_self";

if (w4.Type == 4) //Linkout
{
    exLink = GlobalHelp.GetExternalLinkCTA(w4.OFID, w4.Type, Model._context);
    itemPicUrl = exLink.Item2;
    browserTarget = "_blank";
}
if (w4.Zip == null) { zip = "00000"; } else { zip = w4.Zip; }
if (w4.Latitude == null) { lat = "0.0"; } else { lat = w4.Latitude; }
if (w4.Longitude == null) { lng = "0.0"; } else { lng = w4.Longitude; }
string link = "";
//STORE SALE CHECK
if (w4.StorewideSale > 0)
{
    itemRate = (double)w4.Rate;
    storeCoupon = ((double)w4.StorewideSale / 100) * itemRate;
    salePrice = itemRate - storeCoupon;

}
else { salePrice = (double)w4.Rate; }


var search_params = w4.Zip + " " + w4.OfferingName + " " + w4.OfferingDescription + " " + w4.OfferingDetails + " " + w4.ClassInstructor + " " + w4.Specialty + " " + w4.OfferingCategory + " " + w4.Tags;

    var score = await GlobalHelp.GetSurveyScore(0, w4.OFID, Model._context);

        <div class="prod_list">

            
                @if (w4.Type != 4)
        {
            link = "location.href = '" + @itemPicUrl + "';";
        }
        else
        {
            link = "window.open('" + @itemPicUrl + "','_newtab');";
           
        }
            <div class="card" data-id="w4.OfferingCategory" style="padding:3px;" onclick="@link">
         <div class="con-star">
                    <h7 data-id="@search_params"></h7>
                </div>
            
                    <div class="con-image">
                    @{
                         <img src="https://@Model.Platform.AzureStorageName/offerings/@w4.OFID/of_hero.png" loading="lazy" class="image" data-alt-src="https://@Model.Platform.AzureStorageName/sellers/@w4.SPID/spprofile.png,https://@Model.Platform.AzureStorageName/marketoperators/@Model.MarketOperator.MOID/mo_logo.png" onerror="loadAltImage(this);" />
                    }
                    
                </div>
                @{
                            <[email protected](score.avgScore)-->
                Random random = new Random();
                double rating =  random.Next(4,6);
                int ratingcnt = 0;
                if (rating > 0.0 )
                {
                    ratingcnt = random.Next(5, 20);
                }

                if (Model.MarketOperator.MOID == 147 || Model.MarketOperator.MOID == 155 || Model.MarketOperator.MOID == 168 || Model.MarketOperator.MOID == 172)
                {} else
                {

                <div class="row gt-0 p-0 g-0" style="padding:0;margin:0,0;"><div id="[email protected]" class="col-6 rateyo [email protected] g-0 p-0" style="margin-left:5px;margin-right:5px" data-score="@Convert.ToDouble(score.avgScore)"></div><div class="col-6 g-0 p-0" style="font-size: .8rem;margin-top:0; font-color:green;"><font color="green">@score.totalReview</font></div></div>
                }
                    }


                    

            <div class="con-text">

                                                                    
                    <h6 data-id="@zip" data-id1="@lat" data-id2="@lng" data-id3="@w4.OfferingCategory.ToUpper()">
                    @w4.OfferingCategory
                </h6>
            </div>

Answer 1

设计您的 prodcard 和 prodcard2 部分，并在每个文件的顶部设置模型类型：

@model [whatever type "prod" is]

然后在您的 Index.cshtml 中：

@foreach(var prod in products) 
{
    if(!prod.special)
    {
        <partial name="prodcard" model="prod" />
    }
    else
    {
        <partial name="prodcard2" model="prod" />
    }
}