使用 asp net razor 在 Umbraco 中创建动态滑块

Question

我设法使用 slick slider 创建了一个简单的滑块，但它只显示图像列表，而不是滑块，这是我所做的：

我在我的母版中链接了所有光滑的滑块文件

        <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css"/>
        <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"/>

添加了 javascript 用于在我的页面末尾调用滑块。

$(文档).ready(函数(){ $('.slides').slick({ autoplay:true, pauseOnHover:true }); });

我通过选择一个名为 gallery 的片段并对其进行了一些编辑，从部分视图宏文件创建了一个宏，它的外观如下：

@inherits Umbraco.Web.Macros.PartialViewMacroPage @* 宏来显示媒体部分的图像库。适用于 'Single Media Picker' 或 'Multiple Media Picker' 宏参数（见下文）。

How it works:
    - Confirm the macro parameter has been passed in with a value
    - Loop through all the media Id's passed in (might be a single item, might be many)
    - Display any individual images, as well as any folders of images

Macro Parameters To Create, for this macro to work:
Alias:mediaIds     Name:Select folders and/or images    Type: Multiple Media Picker
                                                        Type: (note: you can use a Single Media Picker if that's more appropriate to your needs)

*@

@{ var mediaIds = Model.MacroParameters["mediaIds"]; }
@if (mediaIds != null)
{
    <div class="slides">
        @foreach (var mediaId in mediaIds.ToString().Split(','))
        {
            var media = Umbraco.Media(mediaId);

            @* a single image *@
            if (media.DocumentTypeAlias == "Image")
            {
                @Render(media);
            }

            @* a folder with images under it *@
            if (media.Children("Image").Any())
            {
                foreach (var image in media.Children("Image"))
                {
                    @Render(image);
                }
            }

        }
    </div>
}

@helper Render(dynamic item)
{
    <div>
    <img src="@item.umbracoFile" alt="@item.Name" />
    </div>
}

在宏中，我添加了这些参数别名：mediaIds 名称：Select 文件和/或图像，类型：多媒体选择器
我在主页上渲染了局部视图宏如下：

@Umbraco.RenderMacro("Gallery", 新 {mediaIds="1120,1118,1119"})

现在，当我预览我的主页时，我得到的是图像列表而不是我想要的滑块，谁能帮我弄清楚为什么它 returns 是图像列表而不是滑块？我是 asp 网络和 Umbraco 的新手，

Answer 1

您需要获取项目的 Url，而不是访问文件本身：

 <img src="@item.Url" alt="@item.Name" />

我真的建议你使用强类型模型而不是动态模型，它们真的让你的生活更轻松

使用 asp net razor 在 Umbraco 中创建动态滑块

Create dynamic slider in Umbraco using asp net razor

javascript

asp.net

umbraco

razor