组件内部的闪电组件列表

Question

我正在尝试在另一个组件内创建组件的可滚动列表。我正在使用卡片视图包含我的信息。当我尝试以下代码时，在可滚动视图中得到了一个奇怪的结果。

<aura:component implements="flexipage:availableForAllPageTypes" access="global" controller="ContentListController">

    <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>

    <!-- Global decleration for the Content Id selected -->
    <aura:attribute name="ContenList" type="Content__c[]"/>

    <div style="max-height: 400px;overflow-y: auto;">
        <aura:iteration items="{!v.ContenList}" var="store">
            <c:ContentCard content="{!store}" duration="1" />
        </aura:iteration>
    </div>

</aura:component>

我得到的结果是，在无人区中滚动条一直处于关闭状态。

我一直在寻找一个看不见的滚动条，或者至少在左侧没有所有填充的滚动条。

Answer 1

您的div正在占用所有可用宽度，而卡（c：ContentCard）的宽度受到了某种限制。这就是为什么卡与滚动条之间存在间隙的原因。 我建议您： 1）删除ContentCard组件的宽度限制；并且 2）委派上级组件负责组织页面上组件的分发。您可以使用slds-grid和slds-col雷电类来控制组件的结构。

Answer 2

    

</lightning:card>

使用闪电cad。

为了您的参考 https://developer.salesforce.com/docs/component-library/bundle/lightning:card/example